reactjs - React-redux 获取站点基本 URL/window.location

Question

希望这是一个非常简单的问题:

我想创建一个包含我网站上页面的完整 URL 的字符串，例如:

https://example.com/documents/1

理想情况下，我想在mapStateToProps()中的react-redux connect()-ed容器中生成它。该页面是使用 browserHistory 的 React-router Route 的孙子(所以也许我可以以某种方式从 React-router 或 browserHistory 获取它？)如果有必要，我会在完整的 React 中完成它类(class)。

但我一生都不知道如何做到这一点。 window(如window.location)在mapStateToProps()中始终是undefined(这并不奇怪)并且在我的 View 组件的 render() 函数中。

到目前为止，我只找到了访问当前路线的方法，例如“/documents/1”，这只是一个相对路径，不包含站点基本 url ( https://example.com/ )

Answer 1

因此，首先，请记住您的代码在客户端和服务器上运行，因此对窗口的任何访问都需要包含在检查中。

  if (typeof window !== 'undefined') {
    var path = location.protocol + '//' + location.host + '/someting'; // (or whatever)
  } else {
    // work out what you want to do server-side...
  }

如果您生成的 URL 显示在 DOM 中，并且在客户端上在第一次渲染之前使用此 URL 填充存储，您将收到校验和错误。如果您确实想要避免该错误，您可以等到根组件中的 componentDidMount() 来获取/设置 url。