是否将现有链接转换为react router？

Question

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

Answer 1

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

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

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

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

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调用）中执行此操作。

最后重要提示：清理！

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