提问者:小点点

是否将现有链接转换为react router<链接到>?


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


共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调用:您需要找到选择所有本机链接的方法;可以在多个步骤(多个QuerySelectorQuerySelectorAllGetElementById调用)中执行此操作。

最后重要提示:清理!

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