我正在尝试通过ID来编辑帖子,我想将ID作为一个道具传递给EditPost组件,我该如何处理?
render() {
return (
<Router>
<Switch >
<Route path="/edit/:id">
<EditPost index={/*what do I do here?*/} />
</Route>
</Switch>
</Router>
);
}
答案 0 :(得分:2)
您可以在EditPost
组件中执行以下操作:
import { useParams } from "react-router-dom";
const EditPost = () => {
const params = useParams();
return <p>Your Post ID is: {params.id}</p>
}
export default EditPost;
并将您的路线设置为:
<Route path="/edit/:id">
<EditPost />
</Route>
希望这对您有用。
答案 1 :(得分:1)
如果使用类组件编写组件,则可以使用下一种方法。这是组件
const EditPost = ({ match }) => {
let { id } = match.params
// ...
}
或与钩子相同:
const EditPost = () => {
let { id } = useParams();
// ...
}
然后在路由器中可以像这样使用它:
<Router>
<div>
<Switch>
<Route path="/blog/:slug" component={BlogPost} />
</Switch>
</div>
</Router>