如何设置反应js中的按钮点击值？

Question

我想用更改按钮点击状态值反应js.I我能够得到单击事件。但不更新的原因。我用这个

btnClick(){ 
    alert('---') 
    // this.setState({data: 'nannsd'}); 
    this.state ={data: 'sds'}; 
    } 

这里的设定值是我的代码 http://codepen.io/naveennsit/pen/MydPJM

class App extends React.Component{ 
    constructor(){ 
    super(); 
    this.state ={data: 'test'}; 
    } 
    btnClick(){ 
    alert('---') 
    // this.setState({data: 'nannsd'}); 
    this.state ={data: 'sds'}; 
    } 

    render(){ 
    return <div> 
     hello {this.state.data} 
     <button onClick={this.btnClick}>click</button> 
    </div> 
    } 

} 

React.render(<App/>,document.getElementById('app')) 

Answer 1

两件事情：

1）构造函数外，你应该调用（的setState而不是直接设置状态）。看起来你可能试过这个，因为它被注释掉了。

2）您需要绑定this，以便您在btnClick内有正确的值。

下面是你的Codepen的一个快速的叉子，这个固定起来。 http://codepen.io/juliepagano/pen/xVNyrO

class App extends React.Component{ 
    constructor(){ 
    super(); 
    this.state ={data: 'test'}; 
    } 

    btnClick(){ 
    alert('---') 
    this.setState({data: 'nannsd'}); 
    // this.state ={data: 'sds'}; 
    } 

    render(){ 
    return <div> 
     hello {this.state.data} 
     <button onClick={this.btnClick.bind(this)}>click</button> 
    </div> 
    } 

} 

React.render(<App/>,document.getElementById('app'))