只渲染新增的节点
之前随便写了个web聊天界面,可以发送图片。之前也没有好好学过前端,更新列表就是直接重新赋值了事,但是这次的消息列表中可能含有大量图片地址,如果全部重新渲染的话开销太大,于是对列表的部分渲染稍作了学习。
划重点:非变更方法
vue官方文档说明
代码部分
在vue定义数据的部分里定义一个数组类型
我定义的是 messageList:{}
然后从后端获取的列表是mlist[],只需要更新新增的内容
把新增的部分用slice函数切下来,然后用concat和原数组连接上
this.messageList = mlist.slice(0, mlist.length - this.messageList.length).concat(this.messageList);