Question

在使用“ react-metismenu”库时没有问题并且可以正常工作，但是使用锚点来选择菜单项。这是不好的。所以要使用react-router-link我使用'react-metismenu-router-link'库但这是错误的错误：（

无法读取未定义的属性“历史” this.context.router.history.listen（this.onLocationChange.bind（this））;

如何解决此问题？

https://www.npmjs.com/package/react-metismenu-router-link

Answer 1

有一个开放的PR可以修复此错误，但原始存储库已存档，因此不会合并。

您可以检出jhillhouse92's fork of react-metismenu-router-link并安装此软件包，而不是原始软件包，其中包含PR的代码。

编辑：我将根据建议添加更多信息。如您在PR中所见，此错误是由使用Context API而不是RouterLink组件中的props引起的。

这些是导致RouterLink.jsx中出现行的错误：

this.context.router.history.listen(this.onLocationChange.bind(this));
this.onLocationChange(this.context.router.route);

jhillhouse92提交正在用道具替换上下文：

  class RouterLink extends React.Component {
    componentWillMount() {
      this.to = this.props.to;
      if (this.to[0] !== '/') this.to = `/${this.to}`;

      // He is using props.history instead of context.router.history
      // and props.location instead of context.router.route
      this.props.history.listen(this.onLocationChange.bind(this));
      this.onLocationChange(this.props.location);
    }

    onLocationChange(e) {
      if ((e.pathname || '/') === this.to) {
        this.props.activateMe();
      }
    }

我们还在RouterLink组件的导出中添加了withRouter，以便为他提供与react-router-dom相关的道具（例如props.history）：

export default withRouter(RouterLink);

通过从git安装软件包或手动进行编辑来应用这些更改，应该可以解决您的错误。

带有react16的“ react-metismenu-router-link”是否存在问题？

1 个答案: