前言

其实很简单只是用了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. Spring Boot SpringSecurity5 身份验证

    对于没有访问权限的用户需要转到登录表单页面.要实现访问控制的方法多种多样,可以通过Aop.拦截器实现,也可以通过框架实现(如:Apache Shiro.Spring Security). pom.xm ...

  2. hdu 4885 (n^2*log(n)判断三点共线建图)+最短路

    题意:车从起点出发,每次只能行驶L长度,必需加油到满,每次只能去加油站或目的地方向,路过加油站就必需进去加油,问最小要路过几次加油站. 开始时候直接建图,在范围内就有边1.跑最短了,再读题后发现,若几 ...

  3. rsync故障排查整理

    1.客户端的错误现象:No route to host rsync服务端开启了iptables防火墙 rsync -avz /etc/hosts rsync_backup@172.16.1.41::b ...

  4. luogu P1074 靶形数独

    题目描述 小城和小华都是热爱数学的好学生,最近,他们不约而同地迷上了数独游戏,好胜的他 们想用数独来一比高低.但普通的数独对他们来说都过于简单了,于是他们向 Z 博士请教, Z 博士拿出了他最近发明的 ...

  5. NOIP临考经验(转)

    [COGS]NOIP临考经验 1.  提前15分钟入场,此时静坐调整心态,适当的深呼吸 2.  打开编辑器并调整为自己喜欢的界面 3.  熟悉文件目录,写好准确无误的代码模板 4.  压缩包或许还不能 ...

  6. 成长笔记 - mysql-5.5.25-winx64安装步骤(及密码修改问题)

    操作系统:Windows 7 64位 下载地址: http://download.mysql.cn/src/2012/0602/5611.html 1. 将mysql-5.5.25-winx64.zi ...

  7. IntelliJ IDEA出现:This file is indented with tabs instead of 4 spaces的问题解决

    根据阿里巴巴Java开发手册,不能使用Tab字符,改成4个字符,设置如下: 注意:是不选择! 一定要选择这个:

  8. php 处理大文件方法 SplFileObject

    $csv_file = 'tmp.csv'; $start = isset($_GET['start']) ?intval($_GET['start']) : 1; // 从第几行开始读取 $num ...

  9. Javascript构造函数和原型

    相信你已经知道了,Javascript函数也可以作为对象构造器.比如,为了模拟面向对象编程中的Class,可以用如下的代码 function Person(name){ this.name = nam ...

  10. 【原】理解javascript中的闭包(***********************************************)

    阅读目录 什么是闭包? 闭包的特性 闭包的作用: 闭包的代码示例 注意事项 总结 闭包在javascript来说是比较重要的概念,平时工作中也是用的比较多的一项技术.下来对其进行一个小小的总结 回到顶 ...