使用param響應路由器根元素

我正在重寫一個ASP.NET MVC應用程序以在TypeScript中使用React和Redux。爲了路由，我使用了React Router。該網站使用根目錄中的參數來標識客戶的組織。使用param響應路由器根元素

示例; www.oursite.com/:organizationId包含深層鏈接就像 www.oursite.com/:organizationId/overview或www.oursite.com/:organizationId/account/:accountId

我已經配置反應路由器如下

import * as React from 'react'; 
import { Router, Route, IndexRoute, HistoryBase } from 'react-router'; 
import { Layout } from './components/Layout'; 
import Home from './components/Home'; 
import OverView from './components/OverView'; 
import Account from './components/Account'; 

export default <Route path='/:organizationId' component={ Layout }> 
    <IndexRoute components={{ body: Home }} /> 
    <Route path='overview' components={{ body: OverView }} /> 
    <Route path='account/:accountId' components={{ body: Account }} /> 
</Route>;

這工作，但在頁面上的任何鏈接部件不這樣做，因爲應用程序/頁的根源仍然是/。

例如

<Link to={'/overview'} activeClassName='active' />

在帳戶控制環節

到www.oursite.com/overview，不www.oursite.com/:organizationId/overview。

有沒有辦法配置React路由器考慮/：organizationId/作爲根？

來源

2017-03-08 Sturnus

如果您查看反應路由器文檔，它看起來像相關鏈接，因爲反應路由器不支持字符串。目前只支持絕對鏈接。

https://github.com/ReactTraining/react-router/blob/master/docs/API.md#link

不過，我覺得你在找什麼就是PARAMS。 React-router將params作爲道具傳遞給連接到路由的每個組件。例如，在您的概述組件中應該有參數支持。你應該能夠做到像

讓我知道，如果這有助於！

來源

2017-03-09 03:26:54

這很好用！因爲我正在使用TypeScript，所以我不得不將{params：{organizationId：string}}添加到適用的props類型聲明中以訪問this.props.params – Sturnus

太棒了！真高興你做到了 –

使用param響應路由器根元素

回答

相關問題