如何使用道具在ReactJS中保存用戶輸入（通過文本框）？

Question

我是ReactJS的新手，我想知道是否有道具讓用戶持續輸入字符串（從文本框輸入）。

Answer 1

我從你的問題中瞭解到，你只是想存儲用戶輸入的用戶輸入值。 所以最好的辦法是保持它的狀態，以便跟蹤它。由於用戶輸入可能會改變，所以最好存儲在一個狀態而不是道具。

因此，下面是可以給出這個想法的簡單實現。

import React from "react"; 

export default class Bind extends React.Component{ 
    constructor(props) { 
     super(props); 
     this.state={ 
      value:'' 
     } 
     this.onChangeInput=this.onChangeInput.bind(this) 
    } 
    render(){ 
     return(
      <div> 
       <div className="well"> 
        <input onChange={this.onChangeInput}/><br/> 
        <cite>{this.state.value}</cite> 
       </div> 
      </div> 
     ); 
    } 
    onChangeInput(event){ 
     this.setState({ 
      value:event.target.value 
     }); 

    } 
} 

其實，在這個組件，我們已經初始化的狀態空值，在我們的渲染方法，其中我們的輸入外地在於我用它調用該函數一些function.and我們剛剛更新了變化事件我們的狀態通過使用value: event.target.value

我希望這對你有意義，我會再說更好的使用狀態來代替道具這裏道具只是傳遞一些數據用於組件，它是不可變的，但狀態是變化的東西，可以保持價值觀，從而通過使用我們的觀點改變。