Question

任何人都可以告诉我为什么我在控制台.log heightSet？

时未定义

componentDidMount() {
    this.updateDimensions();
    window.addEventListener('resize', this.updateDimensions.bind(this));
}

componentWillUnmount() {
    window.removeEventListener('resize', this.updateDimensions.bind(this));
}

updateDimensions() {
    this.setState({ heightSet: document.scrollHeight });
    console.log(document.clientHeight);
}

同样的console.log适用于window.innerHeight（clientHeight也是未定义的）但我不想要内部高度我想要scrollHeight。

感谢

Answer 1

scrollHeight是Element上的属性，所以我猜您可能需要document.body.scrollHeight。

顺便说一下，每次调用this.updateDimensions.bind(this)时都会得到一个新函数，所以你不能使用这种方法来添加和删除相同的事件监听器。

您应该在类中添加一个构造函数，其中包含以下内容：

constructor(props) {
    super(props);
    this.updateDimensions = this.updateDimensions.bind(this);
}

然后您可以直接添加/删除this.updateDimensions：

componentDidMount() {
    this.updateDimensions();
    window.addEventListener('resize', this.updateDimensions);
}

componentWillUnmount() {
    window.removeEventListener('resize', this.updateDimensions);
}

updateDimensions() {
    this.setState({ heightSet: document.body.scrollHeight });
}

Answer 2

您可能想尝试使用“滚动”事件。

componentDidMount() {
    this.updateDimensions();
    window.addEventListener('scroll', this.updateDimensions);
}

componentWillUnmount() {
    window.removeEventListener('scroll', this.updateDimensions);
}

updateDimensions() {
    this.setState({ heightSet: window.scrollY });
}

尝试使用scrollHeight做出反应

2 个答案: