ReactJS:this.setState不是函数?

xoo*_*mer 0 javascript setstate reactjs

我是ReactJS的新手,我遇到错误"this.setState不是函数".

constructor() {
    super();

    this.state = {
        visible: false,
        navLinesShow: true
    };

    this.navOpen = this.navOpen.bind(this)

}

navOpen() {
    this.setState({
        navStatus: "navShow",
        navLinesShow: false
    });

    if ( this.state.visible === false) {

        setTimeout(function (){

            this.setState({
                visible: true
             });

        }, 3000);

    }
Run Code Online (Sandbox Code Playgroud)

我已将this.navOpen = this.navOpen.bind(this)添加到构造函数中.所以我猜问题是setTimeout函数.

什么是可能的解决方案?

谢谢.

pin*_*ric 6

是的问题是setTimeout函数中的setTimeout"this"是指函数本身:所以解决方案是典型的var that = this:

navOpen() {
this.setState({
    navStatus: "navShow",
    navLinesShow: false
});
if ( this.state.visible === false) {
 var that = this;
    setTimeout(function (){
        that.setState({
            visible: true
         });
    }, 3000);
}
Run Code Online (Sandbox Code Playgroud)

  • 你也可以使用箭头函数:`setTimeout(_ => {this.setState(...)},3000)`让`this`按预期工作 (2认同)
  • 如果没有转换/ ES6支持,你可以使用bind避免`that = this`:`setTimeout(function(){...} .bind(this),3000)`:) (2认同)