我收到 this.setState is not a function inside

Question

我看过一些关于“this.setState 不是函数”问题的主题，但没有一个主题为我解决了这个问题。我使用了箭头函数或绑定“this”，但仍然收到错误。初步尝试如下。它使用嵌套的 setTimeout 函数（我可以解释为什么它会有所帮助），但问题是围绕 this.setState 的。在不研究“useEffect”Hook 的情况下，我可以检查下面的代码中是否缺少在 React 中设置状态的基本/基础内容吗？let delay = 5000;      var startTime = new Date().getTime();      let intervalTimerId = setTimeout(function request() {        // first apply a random number to a div        let randomNum = Math.floor(Math.random() * 6) + 1;        // document.querySelectorAll(".someClass"+randomNum)[0].setAttribute("id", "test");        // then after a second, remove the class        setTimeout(() => {          // document.querySelectorAll(".someClass"+randomNum)[0].setAttribute("id", "");          // after another second, set state to use later          setTimeout(() => {            this.setState({someState: "testing"});          }, 1000)        }, 1000)        // set new delay time        if (new Date().getTime() - startTime > 9000) {          delay = 3000;        }        console.log(new Date().getTime() - startTime)        intervalTimerId = setTimeout(request, delay);      }, delay);

Answer 1

您可以尝试使用箭头功能

let delay = 5000;

var startTime = new Date().getTime();

const request = () => {

  // first apply a random number to a div

  let randomNum = Math.floor(Math.random() * 6) + 1;

  // document.querySelectorAll(".someClass"+randomNum)[0].setAttribute("id", "test");

  // then after a second, remove the class

  setTimeout(() => {

    // document.querySelectorAll(".someClass"+randomNum)[0].setAttribute("id", "");

    // after another second, set state to use later

    setTimeout(() => {

      this.setState({ someState: 'testing' });

    }, 1000);

  }, 1000);

  // set new delay time

  if (new Date().getTime() - startTime > 9000) {

    delay = 3000;

  }

  console.log(new Date().getTime() - startTime);

  intervalTimerId = setTimeout(request, delay);

};

let intervalTimerId = setTimeout(request, delay);

Answer 2

您可以使用箭头函数显式绑定 this.bind(this)或简单地用箭头函数替换函数语法，因为this箭头函数内等于this声明该函数的外部：

let intervalTimerId = setTimeout(() => {

    ...

    setTimeout(() => {

       this.setState({someState: "testing"});

    }, 1000)

}, delay);

Answer 3

您可以尝试使用绑定：

let intervalTimerId = setTimeout(function request() { ... }.bind(this)

假设您正在使用类组件并且this尚未损坏，不使用类组件的动机之一是：

除了使代码重用和代码组织变得更加困难之外，我们发现类可能成为学习 React 的一大障碍。您必须了解 JavaScript 中的工作方式，这与大多数语言中的工作方式非常不同。