Question

我具有以下功能：

  fetchData = () => {
      fetch('/api/customerNodes' + this.state.number)
          .then(response => response.text())
          .then(message => {
              this.setState({responseText: message});
          });
    };

如果我将浏览器指向localhost:3000/1234，并且想要获得1234的路径名，则可以执行以下操作。 const num = window.location.pathname;

我面临的问题是我无法将该值设置为状态。

  componentDidMount() {
    const num = window.location.pathname;
    this.setState({ number: num });
    console.log(this.state.number);
    //setInterval(this.fetchData, 250);
  }

console.log为空。

我在做什么错了？

Answer 1

在this.setState中使用回调函数

const num = window.location.pathname;

this.setState({ number: num }, () => {
  console.log(this.state.number, 'number');
});

setState（）通常是异步的，这意味着在您进行console.log状态记录时，它尚未更新。通过将日志放入setState（）方法的回调中，可在状态更改完成后执行

Answer 2

setState是异步的，您不能期望它在下一行代码之前执行。从文档中：

React可以将多个setState（）调用批处理为一个更新，以提高性能。

Answer 3

setState是异步方法。如果您以render方法记录状态，则可以获取数字。

从窗口获取路径名并将其存储在状态中以在提取函数中使用

3 个答案: