时间戳

首页 > 解决方案 > 反应路由器 url 正确更改，但组件未从按钮组件链接呈现

javascript - 反应路由器 url 正确更改，但组件未从按钮组件链接呈现

问题描述

我有类似于以下CodeSandBox示例的内容，其中我需要在两个不同的组件中使用反应路由。

我面临的问题是，如果使用此代码框示例并且我单击Profile或单击Quotes组件级别并假设我在每个底部组件中都有以下 Material-UI 按钮：

            <Button>
                text="New Item"
                variant="outlined"
                className={classes.newButton}
                component={NewItem} 
                to={'/new-item'}
            </Button>

单击此“新建项目”按钮时，URL 更改为正确的路由，即/new-item实际NewItem组件未在页面中呈现？

如果我刷新浏览器，那么它会正确加载。

任何人都可以提供上述帮助吗？最好的解决方案是什么？

标签： javascriptreactjsreact-routermaterial-ui

解决方案

亚瑟，请确保在您的 index.js 或您声明开关的任何地方都像这样设置。

<Switch>
      <Route exact path="/NewItem" component={NewItem}/>
</Switch>

然后你可以像这样简单地添加一个导航链接

<Link to="/NewItem">New Item</Link>

推荐阅读