ReactJS：setTimeout() 不起作用？

小能豆

ReactJS：setTimeout() 不起作用？

javascript

记住以下代码：

var Component = React.createClass({

    getInitialState: function () {
        return {position: 0};    
    },

    componentDidMount: function () {
        setTimeout(this.setState({position: 1}), 3000);
    },

    render: function () {
         return (
            <div className="component">
                {this.state.position}
            </div>
         ); 
    }

});

ReactDOM.render(
    <Component />,
    document.getElementById('main')
);

状态不是应该 3 秒后才改变吗？它会立即改变。

我的主要目标是每 3 秒改变一次状态（使用setInterval()），但由于它不起作用，我尝试了setTimeout()，但也没有起作用。这上面有灯吗？谢谢！

阅读 43

2024-06-05

共1个答案

小能豆

setTimeout(
    function() {
        this.setState({ position: 1 });
    }
    .bind(this),
    3000
);

否则，您将把的结果传递setState给setTimeout。

您还可以使用 ES6 箭头函数来避免使用this关键字：

setTimeout(
  () => this.setState({ position: 1 }), 
  3000
);

2024-06-05