转换现有链接以对路由器<link =“ =”进行反应？

Question

使用React Router时，必须使用Link组件进行链接。 我想将现有网站转换为reactjs Web应用程序。.html是从服务器生成的，并且包含传统链接...有没有办法将这些链接转换为react router链接组件？

Answer 1

您不能直接翻译它们，因为它们不在React范围之内。

您可以使用不同的方法，您将需要两个不同的任务：

1. 通过插入自定义事件处理程序来修改本地（不是由React生成的）本地链接行为
2. 使用代码触发路线更改。

这可以通过使用一些Vanilla JS在React上完成，例如

have add encrypted_password in you AddDeviseToUsers migration

请注意class MyComponent extentds React.Component { componentDidMount() { document.querySelectorAll('a.your_external_links').forEach((a) => { a.addEventListener('click', (ev) => { ev.preventDefault(); this.props.history.push("/new/url") }); }) } } 调用：您需要找到一种方法来选择所有本机链接；您可以分多个步骤执行此操作（多个querySelectorAll，querySelector，querySelectorAll个调用）。

最后的重要提示：清理！

您必须在getElementById中删除新的事件侦听器。