React.js如何使用getElementById方法獲取道具中的id？

Question

開始到最近學習React.js並遇到以下問題： enter image description here

我想用getElementById的div元素，但它不工作和控制檯的警報can not read property 'props' of null。那麼我怎樣才能得到div元素？它困擾了我幾個小時。 謝謝。

Answer 1

React的整個想法是你不訪問DOM，但使用虛擬DOM。

爲了實現您正在嘗試完成的任務（這是因爲代碼不完整而有點不清楚），您需要使用stateful component來存儲用戶輸入this.state。在React表單上查看this page。

你會想要做這樣的事情，你在哪裏通過將其存儲在組件上跟蹤用戶輸入：

class NameForm extends React.Component { 
    constructor(props) { 
    super(props); 
    this.state = {value: ''}; 

    this.handleChange = this.handleChange.bind(this); 
    this.handleSubmit = this.handleSubmit.bind(this); 
    } 

    handleChange(event) { 
    this.setState({value: event.target.value}); 
    } 

    handleSubmit(event) { 
    alert('A name was submitted: ' + this.state.value); 
    event.preventDefault(); 
    } 

    render() { 
    return (
     <form onSubmit={this.handleSubmit}> 
     <label> 
      Name: 
      <input type="text" value={this.state.value} onChange={this.handleChange} /> 
     </label> 
     <input type="submit" value="Submit" /> 
     </form> 
    ); 
    } 
}