React的狀態如何工作？

Question

我的代碼是在這裏：https://jsfiddle.net/woyuditan26/bgwrfLxh/

 this.setState((prevState) => ({ 
     tasks: prevState.tasks.concat(newTask), 
     text: '' //// why the input text is not cleared when I clicked the button ? 
     })); 

爲什麼當我點擊按鈕輸入文本時，不能解除？

Answer 1

原因是，您正在使用uncontrolled element（因爲您沒有使用輸入元素定義value屬性），因此要將其設置爲controlled element，您需要使用input元素指定值prop。

像這樣：

<input type="text" value={this.props.text} onChange={this.handleTextChange}/> 

檢查工作fiddle。