下拉加载更多 记录当前位置。同微信聊天效果(锚点方式)

// dom
<div className={style['system-message-row']} key={id} id={`system-message-${id}`}>
  ...
</div>
// js
/* 由于数据更新一定是处于第一条数据处。
        所以这里获取历史数据中的第一条。
        加载完成后。获取锚点位置更新scroll位置 */
        // 上一次数据的第一条数据的id
        const firstDataId = dot.get(systemMessageList[0], '_id');
        // 上一次数据的第一条数据的dom
        const firstDataDom = document.querySelector(`#system-message-${firstDataId}`);
        await utils.lazy(60);
        // 更新位置
        setBottom(firstDataDom.offsetTop);
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容