Reactjs this.refs 与 document.getElementById

如果我只有基本表格，我还应该吗？this.refs或者只是去document.getElementById?

我所说的基本是指：

export default class ForgetPasswordComponent extends React.Component {
  constructor(props) {
    super(props);

    this.handleSendEmail = this.handleSendEmail.bind(this);
  }

  handleSendEmail(e) {
    e.preventDefault();

    // this.refs.email.value
    // document.getElementById('email').value
  }

  render() {
    <form onSubmit={this.handleSendEmail}>
      <input id="email" ref="email" type="text" />
      <input type="submit" />
    </form>
  }
}

使用其中一种比另一种有缺点吗？

一般来说，refs比document.getElementById，因为它更符合您的 React 代码的其余部分。

在React中，每个组件类可以有多个组件实例。
正如@Isuru 在评论中指出的那样：使用id是危险的，因为 React 不会阻止你在一页上有多个表单，然后你的 DOM 包含多个具有相同 ID 的输入。这是不允许的。

使用引用的另一个优点是，根据设计，您只能在定义引用的上下文中访问引用。如果您需要访问此上下文之外的信息，这会迫使您使用 props 和 state（可能还有存储）。
这是一个优势，因为破坏单向数据流的机会更少/没有机会，这将使您的代码更难以管理。

注意：几乎在所有情况下，裁判都可以完全避免。这是Netflix使用的一个设计原则没有裁判，从来没有，正如 Steve McGuire（Netflix 高级用户界面工程师）在（视频中 9:58m）。
在您的情况下，这意味着将电子邮件输入值放入表单状态，添加 onChange 处理程序，并在提交事件中使用状态值。