具有以下React Router
const AppRoutes = ( <Route path="/" handler={Properties}> <DefaultRoute handler={PropertyList} /> <Route path="property/:propId" handler={PropertyDetail}/> <NotFoundRoute handler={NotFound} /> </Route>); Router.run(AppRoutes, Router.HashLocation, (Root) => { React.render(<Root />, document.getElementById('filter-content')); });
我尝试在子组件内部构建动态链接,然后在这里进行测试
<Link to="/property/" params={{ propId: "123"}} ><img src={this.props.data.picture} data-srcset="http://placehold.it/350x150" alt="" className="lazyload auto-height" data-sizes="auto"/> </Link>
但是单击propId的链接没有通过,我做错了什么?
为了 使它* 起作用,您需要在 Link 组件的 to 属性中使用路由名称,否则路由器将无法知道您指的是哪个路由定义,以及如何使用 propId 参数。 ***
首先,为您的路线定义一个名称
<Route name="property" path="property/:propId" handler={PropertyDetail}/>
然后在生成链接时使用名称:
<Link to="/property/:propId" params={{ propId: "123"}} >