Question

我想使用react js更改按钮单击时的状态值。我能够获得click事件。但是设置值没有更新为什么.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'))

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

1 个答案: