vue 新消息提示

场景分析:
场景1:一个人(信息列表一条)发了多条消息(消息列表多条);
场景2:多个人(信息列表多条)发送了多条消息(消息列表多条)。

思路:
1.把请求的消息列表push进一个数组中,提交到vuex。
2.消息组件外部引用这个数组与最新的请求列表做数据对比(消息id)
3.把id不同的列表再push进一个新数组。
4.这个数组的长度就是新消息的条数,如果两个数组的id/长度都相同的话,没有数据push长度为0,则表示没有新消息。

//组件内部消息请求
getNewsList() { 
  classificationList() 
   .then(res => { 
      this.newsList = res.Rows; 
      // 1新数组 
      let newArr = []; 
      for(let i=0; i { 
       console.log("error", err); 
   });
 }
//组件外部消息请求
//html
我的消息{{newLen}}

1.消息外部

2.消息组件内部

3.有新消息提醒

PS:新手第一次尝试写博客,有什么地方不好的还望诸位不吝赐教
author:Github ----- XiNine

你可能感兴趣的:(vue.js,css,javascript)