我目前在我的 ReactJS 项目中遇到了 React Router 问题。我有一个呈现视图的页面，在视图内部是一个.map 函数，它映射所有用户并将“first_name”放在<h4>标记内。地图功能适用于所有用户。
我希望能够点击用户的 first_name 并导航到以_id 为参数的新路线。您导航到的新组件将收到_id，我将在数据库中搜索_id。
预期路线：
| URL | Components |
|---------------------|------------|
| `/` | `Main` |
| `/platform` | `Platform` |
| `/platform/:userID` | `Editor` |
目前我有 3 个文件，routes.js包含所有 ReactRouter 配置。 index.js保存数据库中呈现的用户列表。并且editor.js文件将在 URL 中接收用户的_id。
// Routes.js
import Main from './components/main';
import Home from './components/home';
import Platform from './components/platform';
import Editor from './components/editor';
<Route name="home" path="/" component={Main}>
<IndexRoute component={Home} />
<Route name="platform" path="platform/" component={Platform}>
<Route name="user" path="/:userId" handler={Editor} />
</Route>
</Route>
// Platform.js
{users.map(({_id, first_name, last_name}, index)=>
<div>
<Link to="user" params={{userId: _id}}>
<h4 style={{fontFamily: 'Raleway', color: '#498EE0'}}>{first_name} {last_name} : {_id}</h4>
</Link>
<hr />
</div>
)}
您应该能够单击Link并将参数添加到 URL 上。
目前，当我尝试这个时，它会简单地将/user附加到我的网址上，因此它显示为localhost:8080/user
1 回答
您需要像这样更改
to参数 -