JS div滚动到React组件的底部

Question

我通过编写函数scrollToBot遇到了问题。 该函数将由componentDidMount和componentDidUpdate调用。 但是div不会滚动。 我不知道此功能有什么问题。 我必须使用JQuery来实现此功能吗？

提前致谢。

scrollToBot(){
    console.log(this.textAreaDiv.offsetHeight); // 4000
    if(this.textAreaDiv.offsetHeight>3000){
        console.log("should scoll!!!!!!!!!!!!!!"); // showed
        this.textAreaDiv.scrollTop=2000;
    }
    console.log('run scrollTo'); // showed
}

componentDidMount(){
    this.scrollToBot();
}

componentDidUpdate(){
    this.scrollToBot();
}

Answer 1

这将无法工作在反应，因为它使用的虚拟DOM，访问你需要使用参考文献中描述的真正的DOM元素阵营文件

Answer 2

在您的JSX中，使用ref以便从其余react组件访问dom元素。

例：

...
textAreaDiv: null

setInputRef(dom){
    this.textAreaDiv = dom
}

render(){
    <div ref={this.setInputRef}/>
}

`