reactjs - Ionic React props.match.params 不更新
问题描述
我正在建立一个网站来展示带有 React 和 Ionic 的房地产。
我的App.tsx中有这个路由
<IonApp>
<IonReactRouter>
<Nav />
<IonRouterOutlet id="first">
<Route exact path="/" component={Home} />
<Route exact path="/all-properties" component={Properties} />
<Route exact path="/property/:id" component={Property} />
</IonRouterOutlet>
</IonReactRouter>
</IonApp>
我链接到"/property/:id"
我网站中的单个页面,如下所示:
<Link to={"/property/" + variableId}> ... </Link>
现在在我的"/property/:id"
页面上,我可以像这样从 URL 访问 id:
useIonViewDidEnter(() => {
console.log(props.match.params.id); // This works the first time
});
问题是,当我点击返回说主屏幕,然后访问我的另一个"/property/:id"
页面时,它props.match.params.id
保持不变。它不更新。
可以做些什么来修复它?
解决方案
事实证明,问题在于离子生命周期方法。
我的解决方案是像这样制作一个 useEffect :
useEffect(() => {
console.log(props.match.params.id)
}, [props.match.params.id])
推荐阅读
- java - tophits JAVA API的Elasticsearch子聚合不起作用
- freemarker - 在 FreeMarker 中将一小时添加到当前时间戳
- matlab - 没有箭杆的箭袋图
- firebase - 在通过 Web 连接的用户上与 Firestore 同步数据
- javascript - 谷歌地图的 javascript 版本的新版本是否适用于 JavaFx-WebView
- mysql - nodejs 连接 MYSQL 时出现问题,MYSQL 由 mongodb 通过 JWT 身份验证连接
- android - 通知文本未在 Android P 中本地化
- javascript - 在不丢失缩放控制的情况下更新 amMap 中的图像 - AmCharts v4
- laravel - 登录以在 laravel 的服务器中使用另一个 API
- datatables - 我们需要如何导出 pdf 内容数字数据右对齐