2

我正在建立一个网站来展示带有 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保持不变。它不更新。

可以做些什么来修复它？

4

1 回答 1

1

事实证明，问题在于离子生命周期方法。

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

useEffect(() => {
   console.log(props.match.params.id)
}, [props.match.params.id])
于 2020-12-09T08:52:52.630 回答