Question

Newbie reactjs用户在这里。

我有一个reactjs元素<PlayStopBtn/>，基本上只需在每次点击时切换显示START或STOP。我的反应元素如下所示：

var PlayStopBtn = React.createClass({
    getInitialState: function() {
        return {data: null};
    },
   onClick: function(event) {
       if(this.state.data == "running")
           this.setState({data: "stopped"});
       else
           this.setState({data: "running"});
   },
   render: function()
   {
       return (<div>{this.state.data == "running" ? "START" : "STOP"}</div>);
   }
});

但是，当元素呈现时，它会显示STOP并单击该元素不会执行任何操作。我做错了什么或者我必须告诉reactjs重新渲染元素吗？

Answer 1

您缺少设置onClick处理程序

<div onClick={this.onClick}>{this.state.data == "running" ? "START" : "STOP"}</div>

状态更改后更新div渲染

1 个答案: