如何在react中滚动到底部？

正如Tushar提到的，您可以在聊天的底部保留一个虚拟div：

render（）{
返回(
&lt；div&gt；
&lt；div className=“MessageContainer”&gt；
&lt；div className=“MessagesList”&gt；
{this.renderMessages（）}
&lt；/div&gt；
&lt；div style={{float:“left”，清除：“both”}
ref={（el）=&gt；{this.messagesEnd=el；}}&gt；
&lt；/div&gt；
&lt；/div&gt；
&lt；/div&gt；
);
}

然后在组件更新时滚动到它（即添加新消息时状态更新）：

scrollToBottom=（）=&gt；{
this.messagesEnd.scrollIntoView（{behavior:“smooth”}）；
}
componentDidMount（）{
这个.scrollToBottom（）；
}
componentDidUpdate（）{
这个.scrollToBottom（）；
}

我在这里使用的是标准的Element.scrollIntoView方法