我正在学习如何使用react-router。我的路由工作正常，这意味着当我单击相应的链接时，我会获得所需的视图。我有一个嵌套/子路由的视图。单击这些子链接会将我带到相应的视图，但它不会按照我的意愿更新浏览器的URL。
我从视图的IndexRoute开始。浏览器的URL看起来像这样，这就是我想要的：
http://localhost:3000/administration
当我点击不同的子路由时，它会不断将子路由的路径附加到URL上，这样在几次点击后，浏览器的URL最终会看起来像这样：
http://localhost:3000/administration/administration/administration/administration/administration/administration/administration/administration/company-goals
当我想要的是浏览器的URL：
http://localhost:3000/administration/company-goals
我的路线结构设置如下：
<Route path="/" component={HomePage}>
<IndexRoute component={HomeView} />
<Route path="budgets" component={BudgetView} />
<Route path="administration" component={adminViews.Administration}>
<IndexRoute component={adminViews.Home} />
<Route path="department-budgets" component={adminViews.DepartmentBudgets} />
<Route path="price-list" component={adminViews.PriceList} />
<Route path="company-goals" component={adminViews.CompanyGoals} />
</Route>
</Route>
“管理”视图具有选项卡式导航，其中包含每个“管理”视图的子路径的选项卡。
当用户点击具有如下功能的标签时，我正在更改路线：
selectedTab( tab ) {
const menu = menuItems.find((item) => {
return item.payload === tab.value;
});
history.pushState(null, menu.uriPath);
}
每条路线的uriPath定义如下：
menuItems = [
{
payload : '1',
text : 'Home',
uriPath : 'administration'
},
{
payload : '2',
text : 'Department Budgets',
uriPath : 'administration/department-budgets'
},
{
payload : '3',
text : 'Price List',
uriPath : 'administration/price-list'
},
{
payload : '4',
text : 'Company Goals',
uriPath : 'administration/company-goals'
}
];
非常感谢任何帮助。我觉得我错过了一些非常基本的东西，但我无法确定我做错了什么。
谢谢！
答案 0 :(得分：5)
将/放在uriPath的开头。