Question

如果ref也可以实现同样的目的时，如果document.querySelector做出反应，会是什么用例？

Answer 1

document.querySelector()无法满足refs的目的。 因为refs用于定位React组件，而document.querySelector()返回HTML元素 考虑这个例子。

class Parent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
       childid:"someid"
    }
  }
  render() {
    return <Child ref={this.myRef} id={this.state.childid} />;
  }
}

class Child extends React.Component {
  constructor(props) {
    super(props);
    this.state = { 
       data:"something"
    }
  }
  render() {
    return <div id={this.props.id}/>;
  }
}

在以上代码中，您可以使用父元素中的<div>获得document.querySelector()。但是您无法在父级内部获得<Child/>组件。没有引用，您将无法以data的状态访问Child

为什么react.js中需要ref？

1 个答案: