按钮单击可使文本字段可编辑

Question

我对React很陌生，所以对此缺乏代码感到抱歉。

假设我有一个显示用户名称的文本字段。单击按钮时，我希望此字段可编辑。

可以在ReactJS中完成吗？

Answer 1

像这样使用，

ES6 js：

 class App extends React.Component{
  constructor(){
    super()
    this.state={disable:true,
               val:"username"}
  }
  handleClick(e){

 this.setState({disable:!this.state.disable})
  }
  render(){
    return(
      <div className="wrapper">
        <input type="text" disabled={this.state.disable} value={this.state.val}/>
       <input type="button" value="Enable/Disable" onClick={this.handleClick.bind(this)}/>
      </div>
    )
  }
}

工作Jsbin