React Inline Style: ReferenceError: window is not defined

Question

我在 React Component 中导入 SCSS 样式表时出现此错误:

server.js:614 return /msie [6-9]\b/.test(window.navigator.userAgent.toLowerCase()); ^

ReferenceError: window is not defined

这是我的Home.jsx

为什么？？？

Answer 1

因为您是在服务器上渲染您的视图在服务器 (node.js) 中我们没有 window 对象

更改代码以在客户端呈现使用 componentDidMount 事件和标记

export default class AsyncMap extends Component {

  state = {
    inBrowser: false
  }

  componentDidMount() {
    this.setState({inBrowser: true});
  }

  yourCurrentRender() {...}

  render() {
    let res = null;
    if (this.state.inBrowser) {
      res = this.renderNewBehavior();
    } else {
      res = <span>Loading</span>;
    }
    return res;
  }
}

Answer 2

window object is available only on the client side

1.* 第一步是确保您没有进行服务器端渲染，window 对象是仅在浏览器上可用。

2.* 其次，如果您正在使用 webpack 并且运行您的应用程序在 webpack-dev-server 模式你的 window 对象是不可检测的所以而不是

localhost: 8080/webpack-dev-server/

尝试

localhost: 8080/

React Inline Style: ReferenceError: window is not defined

React Inline Style: ReferenceError: window is not defined

reactjs

react-router

isomorphic-javascript