Question

当我得到componentDidMount中元素的offsetTop与在componentDidUpdate（）中调用时相同元素的offsetTop值不同时，

in react。这是为什么？我认为在渲染之后调用componentDidMount，所以DOM元素放在页面中，所以offsetTop值应该是正确的。

class Index extends React.Component {
    ...
    render() {
        return (
            <div className="site-wrapper">
                <TopHeader />
                <IntroSection />
            </div>
        );
    }
}


class TopHeader extends React.Component {
    ...
    componentDidMount() {
        var rect = ReactDOM.findDOMNode(this).offsetTop;
        console.log(rect);
    }
}


class IntroSection extends React.Component {
    ...
    componentDidMount() {
        var rect = ReactDOM.findDOMNode(this).offsetTop;
        console.log(rect);
    }
}

Answer 1

componentDidMount只调用一次。但是，即使通过状态或道具，也会为组件收到的每个更新调用componentDidUpdate。

然后，我们建议将offsetTop保留在两个生命周期方法的组件状态中。

得到React元素offsetTop

1 个答案: