javascript - 在渲染之前从 virtualDOM 访问父节点 | 反应JS

Question

我需要根据父元素设置组件尺寸。是否可以在渲染之前通过 ref 从 virtualDOM 获取父级的宽度和高度？

家长

export default class App extends React.Component {
  render() {

    return (
      <div>
        <div className={'avocado-container'} ref={(container) => { this.container = container; }}>
          <Resizer parent={this} scrollAxis={'y'}>
          </Resizer>
        </div>
      </div>
    );
  }
}

我需要在孩子的构造函数中获取尺寸。

像这样的东西是可能的this.refs.container.offsetWidth吗？

Answer 1

不，布局尺寸由浏览器计算，而不是虚拟 DOM。要么手动设置尺寸，要么使用 CSS 使您的子组件填充宽度和高度。您还可以从渲染组件中读取宽度和高度componentDidMount并在那里调用setState，这并不理想并且会导致第二次渲染，但有时需要完成。