其实很简单只是用了js的几个函数

1. substr
2. unshift
3. splice

完整代码 | mpvue模仿QQ

代码

思路很简单,获取当前元素下标然后通过unshift函数将该值插入到数组第一位,再通过splice函数删除该值

核心代码

 listTop (e) {
      const that = this
      let index = e.currentTarget.dataset.eventid.substr(e.currentTarget.dataset.eventid.length - 1, 1)
      that.messageList.unshift(that.messageList[index])
      that.messageList.splice(++index, 1)
    }

效果图