SetTimeout в обратном вызове, чтобы сбросить состояние

Question

Попытки использовать setTimeout в обратном вызове, чтобы сбросить состояние через несколько секунд, но получить ошибку неперехваченного TypeError: this.setState не является функция

Может кто-нибудь, пожалуйста, помогите?

setMainState: function() { 
    this.setState({ 
     clicked: !this.state.clicked 
    }, this.delayState()); 
}, 

delayState: function() { 
    setTimeout((function() { 
     this.setState({ 
      clicked: false 
     }), 2000})); 
}, 

handleClick: function(event) { 
    this.setMainState(); 
}, 

Answer 1

Это происходит потому, что this в setTimeout обратного вызова не ссылается на ваш компонент объекта, вам нужно установить this сами с .bind

setTimeout(function() { 
    this.setState({ 
    clicked: false 
    }) 
}.bind(this), 2000); 

или если вы используете ES2015, вы можете использовать arrow function

setTimeout(() => { 
    this.setState({ 
    clicked: false 
    }) 
}, 2000); 

Answer 2

Контекст это изменение в функции setTimeout, чтобы вы не ред взять переменную для хранения этого объекта self и тогда это будет то же самое в этой функции

setMainState: function() { 
    this.setState({ 
     clicked: !this.state.clicked 
    }, this.delayState()); 
}, 

delayState: function() { 
var self = this; 
    setTimeout((function() { 
     self.setState({ 
      clicked: false 
     }), 2000})); 
}, 

handleClick: function(event) { 
    this.setMainState(); 
},