Question

我有一个使用findDOMNode（）的旧代码。

这是我的代码，其中someComponent1和Expand已经导入

这里我有一些疑问，我用findDOMNode（）编写的代码工作得非常好但是现在我已经弃用了，我想删除它。我已经浏览了很多文档，发现使用门户网站或引用而不是这个。我有一个理解，如果我使用ref然后变量get绑定也可以访问DOM元素，但我想我错了，因为它以这种方式工作。有人可以纠正我对此的理解

class classA extends Component {

  componentDidMount() {
    new Expand(ReactDOM.findDOMNode(this.expand))
    // new Expand(this.expand)    
  }

  render(){

    return(
      <someComponent1 className={style.container} ref={e => this.expand= e}/>
    )
  }
}

Answer 1

根据 this github issue 和 ReactDocs ，不推荐使用ReactDOM.findDOMNode，但不建议使用它，只应将其用作逃生舱。为了替换它，您需要在DOM元素上指定ref，在您的情况下看起来像

class classA extends Component {

  componentDidMount() {
     new Expand(this.expand)    
  }

  render(){

    return(
      <SomeComponent1 className={style.container} innerRef={e => this.expand= e}/>
    )
  }
}

class SomeComponent1 extends React.Component {
    render() {
       return <div ref={this.props.innerRef}>Hello</div>
    }
}

ReactDOM.findDOMNode（）的替代方法是什么，因为它现在已被弃用？

1 个答案: