VUE 前端大佬，有个图片异步懒加载相关的问题

[cnbattle]

场景： 聊天 消息列表接口，图片后端仅记录图片 key ，独立接口 获取图片 base64 数据

前端需要 懒加载渲染图片，即 懒加载，用独立请求图片 base64 接口 接口数据格式为 json,其中一个字段为 图片 base64 数据

目前是获取消息列表时 同步处理，并发拿图片 base64, 消息列表显示出来比较慢

怎么能优雅实现这样的需求

[vituralfuture]

图片链接放 data-src 里，img 元素进入视口后把 data-src 赋给 src

[cnbattle]

@vituralfuture 不行的，可能我表达的不清楚

1. 列表接口没有图片链接，没有图片 base64 数据
2. 图片 base64 数据， 得从另一个接口请求

[WJYuan]

@cnbattle #2 这种情况不影响啊，只是把 data-src 替换为 key 而已，思路是一样的，你
1.首先获取列表借口，此时图片全部渲染为 loading 图
2.Intersection Observe API 请求 base64
3.请求到 base64 后替换 src

[cnbattle]

@WJYuan 嗯， 理解了，感谢