React Router Parameters 是 React Router 库中的一个重要特性,它允许你通过动态路由参数来传递数据。这使得构建可扩展和灵活的路由变得非常容易。
什么是 Parameters?
Parameters 是指在路由路径中使用的动态部分。例如,在 /users/:id
路径中,:id
就是一个参数。这个参数可以在组件中通过 this.props.match.params.id
来访问。
例子
假设我们有一个用户列表页面,每个用户都有自己的详情页面。我们可以这样设置路由:
/users
:用户列表页面/users/:id
:单个用户详情页面
当用户点击某个用户时,我们可以通过传递用户 ID 作为参数来导航到详情页面。
// 用户列表页面
function UserList() {
return (
<div>
<h1>User List</h1>
<ul>
{users.map(user => (
<li key={user.id}>
<a href={`/users/${user.id}`}>View Profile</a>
</li>
))}
</ul>
</div>
);
}
// 用户详情页面
function UserProfile({ match }) {
const userId = match.params.id;
// ... 获取用户信息并渲染
}
更多资源
要了解更多关于 React Router 的信息,请访问React Router 官方文档。
