setTimeoutは、setStateの反応でコールバックとして機能しますか？

Question

コード：

setTimeout(() => { 
       this.setState((state, props) => ({ 
        activateLightColorForRed: true 
       }),() => { 
        setTimeout(
        this.setState((state, props) => ({ 
         activateLightColorForRed: false 
        })), 3000); 
       }); 
       red.play() 
       }, 3000); 

それが働いているが、私は3秒後にfalseにactivateLightColorForYellowを設定する必要がSETSTATE反応しにはコールバックがありません。私がsetTimeoutの外でsetstateを使用すると、setstateは機能しません。助けて？

Answer 1

あなたは構文エラーがあると思います。 2番目のsetTimeoutに矢印関数がありません。

これを試してください。あなたは状態が実際に変更されていることを確認するために

setTimeout(()=> { 
    this.setState((state, props) => ({ activateLightColorForRed: true }),() => { 
    setTimeout(()=> { 
     this.setState(()=> ({ activateLightColorForRed: false })) 
    }, 3000); 
    red.play(); 
    }) 
}, 3000); 

Answer 2

setStateのコールバックがあります。

SETSTATEのコールバックを取り除く

class App extends React.Component { 
 
    constructor(props) { 
 
    super(props); 
 

 
    this.state = { 
 
     title: "click me" 
 
    }; 
 

 
    this.onClick = this.onClick.bind(this); 
 
    } 
 

 
    onClick(e) { 
 
    this.setState({ title: "value 1" },() => { 
 
     setTimeout(() => { 
 
     this.setState({ title: "value 2" },()=>{ 
 
      setTimeout(()=>{ 
 
      this.setState({title: 'value 3'}) 
 
      },1500); 
 
     }); 
 
     }, 1000); 
 
    }); 
 
    } 
 

 
    render() { 
 
    return (
 
     <div> 
 
     <div onClick={this.onClick}>{this.state.title}</div> 
 
     </div> 
 
    ); 
 
    } 
 
} 
 

 
ReactDOM.render(<App />, document.getElementById("root"));

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> 
 
<div id="root"></div>