reactjs – 从React子元素获取DOM节点

前端之家收集整理的这篇文章主要介绍了reactjs – 从React子元素获取DOM节点前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
使用v0.13.0中引入的React.findDOMNode方法,我能够通过在this.props.children上映射来获取传递到父组件的每个子组件的DOM节点。

然而,如果一些孩子碰巧是React元素而不是组件(例如,一个孩子是通过JSX创建的< div>),React会抛出一个不变的违规错误

有没有办法获得正确的DOM节点的每个孩子后挂载无论什么类的孩子是?

this.props.children应该是ReactElement或ReactElement的数组,而不是组件。

获取children元素的DOM节点,您需要克隆它们并为它们分配一个新的引用。

render() {
  return (
    <div>
      {React.Children.map(this.props.children,(element,idx) => {
        return React.cloneElement(element,{ ref: idx });
      })}
    </div>
  );
}

然后,您可以通过this.refs [childIdx]访问子组件,并通过ReactDOM.findDOMNode(this.refs [childIdx])检索其DOM节点。

原文链接:https://www.f2er.com/react/302470.html

猜你在找的React相关文章