使按鈕單擊文本字段可編輯

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