前言

其实很简单只是用了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)
}

效果图

mpvue——实现点击数组内的某一元素进行置顶(排序第一)操作的更多相关文章

  1. ROWNUMBER() OVER( PARTITION BY COL1 ORDER BY COL2)用法,先分组,然后在组内排名,分组计算,主表与附表一对多取唯一等

    ROWNUMBER() OVER( PARTITION BY COL1 ORDER BY COL2)用法 今天在使用多字段去重时,由于某些字段有多种可能性,只需根据部分字段进行去重,在网上看到了row ...

  2. 组内Linq培训记录

    注: 由于该培训是在组内分享,先写成了Word,而word中的代码都以截图方式呈现了,而在博客园不能很方便的粘贴截图进来,所以我用插入代码的方式加进来,如果文中说“如下图”或“如下图代码”,那么就直接 ...

  3. sql 分组后 组内排名

    语法:ROW_NUMBER() OVER(PARTITION BY COLUMN ORDER BY COLUMN) 简单的说row_number()从1开始,为每一条分组记录返回一个数字,这里的ROW ...

  4. sql查询技巧,按时间分段进行分组,每半小时一组统计组内记录数量

    今天拿到一个查询需求,需要统计某一天各个时间段内的记录数量. 具体是统计某天9:00至22:00时间段,每半小时内订单的数量,最后形成的数据形式如下: 时间段          订单数 9:00~9: ...

  5. 如何用SQL实现组内前几名的输出

    关于问题 如何查询组内最大的,最小的,大家或许都知道,无非是min.max的函数使用.可是如何在MySQL中查找组内最好的前两个,或者前三个? 什么是相关子查询 在提出对于这个问题的对应方法之前,首先 ...

  6. BIRT实现组内跨行计算

    问题来源:http://developer.actuate.com/community/forum/index.php?/topic/36160-dealing-with-previous-rows- ...

  7. 模拟QQ分组(具有伸缩功能) (添加开源框架的光闪烁效果)SimpleExpandableListAdapter 适配器的用法,并且可添加组及其组内数据。

    package com.lixu.qqfenzu; import java.util.ArrayList; import java.util.HashMap; import java.util.Lis ...

  8. sql server迁移数据(文件组之间的互相迁移与 文件组内文件的互相迁移)

    转自:https://www.cnblogs.com/lyhabc/p/3504380.html?utm_source=tuicool SQLSERVER将数据移到另一个文件组之后清空文件组并删除文件 ...

  9. VUE组内培训

    最近去参加了一个外部VUE的周末培训,加上自己比较感兴趣所以对这项很热的前端框架做了点学习,顺便给组内同事做个简单的分享,希望下次有项目可以使用上- VUE的语法教程网上很多我就不一一列举,截图放一下 ...

随机推荐

  1. Ubuntu MySQL的安装使用

    删除 mysql sudo apt-get autoremove --purge mysql-server-5.0 sudo apt-get remove mysql-server sudo apt- ...

  2. 51nod1053 最大M子段和 V2

    $n \leq 50000$的序列,问选不超过$m \leq 50000$个区间使得和最大. 如果正数区间总数比$m$小那肯定全选.否则有两种方式减少区间数量:丢掉一个正区间:补一个负区间连接两个正区 ...

  3. BZOJ——1610: [Usaco2008 Feb]Line连线游戏

    http://www.lydsy.com/JudgeOnline/problem.php?id=1610 Time Limit: 5 Sec  Memory Limit: 64 MBSubmit: 2 ...

  4. 洛谷——P1290 欧几里德的游戏

    P1290 欧几里德的游戏 题目描述 欧几里德的两个后代Stan和Ollie正在玩一种数字游戏,这个游戏是他们的祖先欧几里德发明的.给定两个正整数M和N,从Stan开始,从其中较大的一个数,减去较小的 ...

  5. [置顶] MySQL -- 创建函数(Function

    目标 如何在MySQL数据库中创建函数(Function) 语法 CREATE FUNCTION func_name ( [func_parameter] ) //括号是必须的,参数是可选的 RETU ...

  6. iinflux数据库使用

    特殊用法: http://blog.fatedier.com/2016/07/05/research-of-time-series-database-influxdb/ 创建表及表中的key和valu ...

  7. Android Studio 2.0 Beta 5公布,修复几个与即时执行相关的严重BUG.

    Android Studio 2.0 Beta 5公布,修复几个与即时执行相关的严重BUG. This build fixes a couple of important bugs related t ...

  8. BUPT复试专题—数据库检索(2014软院)

    题目描述 在数据库的操作过程中,我们进场会遇到检索操作.这个题目的任务是完成一些特定格式的检索,并输出符合条件的数据库中的所有结果. 我们现在有一个数据库,维护了学生的姓名(Name),性别(Sex) ...

  9. 设计模式之命令模式(Command)摘录

    23种GOF设计模式一般分为三大类:创建型模式.结构型模式.行为模式. 创建型模式抽象了实例化过程,它们帮助一个系统独立于怎样创建.组合和表示它的那些对象.一个类创建型模式使用继承改变被实例化的类,而 ...

  10. SpringBoot学习之启动报错【This application has no explicit mapping for /error.....】

    今天做SpringBoot小例子,在请求controller层的时候出现如下问题. Whitelabel Error Page This application has no explicit map ...