如何在反应中滚动到底部？

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

render () {  return (    <div>      <div className="MessageContainer" >        <div className="MessagesList">          {this.renderMessages()}        </div>        <div style={{ float:"left", clear: "both" }}  ref={(el) => { this.messagesEnd = el; }}>        </div>      </div>    </div>  );}

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

scrollToBottom = () => {  this.messagesEnd.scrollIntoView({ behavior: "smooth" });}componentDidMount() {  this.scrollToBottom();}componentDidUpdate() {  this.scrollToBottom();}

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