Ionic React props.match.params 不更新

Question

我正在构建一个网站，以使用 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>

然后我 link 到我网站中的单个 "/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 保持不变。不更新了。

如何解决？

Answer 1

原来是 Ionics 生命周期方法出了问题。

我的解决方案是像这样制作一个 useEffect：

useEffect(() => {
   console.log(props.match.params.id)
}, [props.match.params.id])

Ionic React props.match.params 不更新

Ionic React props.match.params doesn't update

reactjs

ionic-framework

react-router-dom

ionic-react