javascript - React.js 如何使用 getElementById 方法获取 props 中的 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 上。查看this page在 React 表单上。

你会想要做这样的事情，你通过将它存储在组件上来跟踪用户输入:

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>
    );
  }
}