React Router v6 onclick

布拉德法師

我以前問過同樣的問題,但現在它不適用於 react-router v6。

我已將問題簡化<Link />為單擊a 時如何輸出到控制台

側邊菜單組件中的鏈接

<Link to={"/entity"}>Entity</Link>

來自主 app.js 的路由

<Routes>
    <Route path="/entity" element={<Entity />} />
</Routes>

第二次單擊鏈接後如何執行操作(頁面已經顯示)此示例只是在<Link>單擊時輸出到控制台,但輸出僅顯示第一次加載(或安裝)


function Entity(props) {

    console.log('link clicked');

    useEffect(() => {
        console.log('link clicked');
    });

}
德魯里斯

與之前的解決方案相比,新的解決方案的主要變化是 RRDv6 沒有Redirect組件並且Link組件 API 略有變化,路由狀態現在是一級 prop 而不是嵌套在toprop 對像上。

關聯

<Link
  onClick={() => setLinkKey(uuidV4())}
  key={linkKey}
  to={"/users"}
  state={{ key: linkKey }}
>
  Users
</Link>

如果已經在路由上,則在該路由上呈現的組件仍然只是在再次單擊該鏈接時查找要更改的鍵。

編輯 how-to-know-a-react-link-component-has-been-clicked (forked)

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章