JZTXT
  • 首页
  • Ai
  • Java
  • Python
  • Android
  • Mysql
  • JavaScript
  • Html
  • CSS

react 实现聊天界面,发送消息自动到底部

发布时间 2023-06-02 09:28:27作者: WrYcF

<div style={{ float:"left", clear: "both" }}
                         ref={(el) => { this.messagesEnd = el; }}>
</div>      
  scrollToBottom = () => {
    this.messagesEnd.scrollIntoView({ behavior: "auto" });
  }
  componentDidUpdate(prevProps, prevState, snapshot) {
    const { message } = this.state;
    this.scrollToBottom();

  }
  componentDidMount() {
      this.scrollToBottom();
}

 

    本栏目推荐文章
  • 2024-01-13 记录react-dnd拖拽组件的用法
  • 2024-01-13 react 监听上一页返回
  • 第二章 Spring Boot 整合 Kafka消息队列 生产者
  • Unity 获取当前系统时间并在UI界面中显示
  • 2024-01-13 Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. ==》引用了未使用的方法导致
  • 动力节点RabbitMQ教程|12小时学会rabbitmq消息中间件-01
  • 002*:React状态、属性、传值
  • 消息队列面试题:为什么要使用消息队列?
  • react-native在windows环境搭建并使用脚手架新建工程
  • 升讯威在线客服系统的并发高性能数据处理技术:实现拔网线也不丢消息的高可靠通信(附视频)
版权声明:本网站为非赢利性站点,本网站所有内容均来源于互联网相关站点自动搜索采集信息,相关链接已经注明来源。
联系我们