前言

其实很简单只是用了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. jQuery on() 和 live

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script sr ...

  2. Android UI设计--半透明效果对话框及activity(可做遮罩层)

    下面是style的一些属性及其解释 <style name="dialog_translucent" parent="@android:style/Theme.Di ...

  3. Mysql Binlog日志文件介绍

    一.Binlog简介 官方文档参考 https://dev.mysql.com/doc/refman/5.5/en/binary-log.html Binlog(Binary Log) 指数据库的表创 ...

  4. cobbler api接口开发测试实例

    条件1:必须搭建好cobbler服务,并且可以通过web访问:http://cobbler_ip/cobbler_web 测试可以打开.然后再用以下命令测试. #!/opt/python3/bin/p ...

  5. Java_AOP原理

    AOP : 面向切面编程 在程序设计中,我们需要满足高耦合低内聚,所以编程需满足六大原则,一个法则. AOP面向切面编程正是为了满足这些原则的一种编程思想. 一.装饰者模式: 当我们需要给对象增加功能 ...

  6. List 与 ArrayList 的使用

    最近回顾 java 集合,发现大部分程序中都在使用 List list = new ArrayList(); 也有部分程序使用 ArrayList list = new ArrayList(); 那么 ...

  7. mysql大数据量分页查询优化

    参考文章:https://www.dexcoder.com/selfly/article/293 Mysql的分页查询十分简单,但是当数据量大的时候一般的分页就吃不消了. 传统分页查询:SELECT ...

  8. call lua function from c and called back to c

    Just a simple example: --The  c file: #include <stdio.h> #include "lua.h" #include & ...

  9. 利用Loader来动态载入不同的QML文件来改变UI

    在这篇文章中.我们将介绍怎样使用Loader来载入不同的QML文件来实现动态的UI.在之前的文章"怎样使用Loader来动态载入一个基于item的Component"中,我们已经介 ...

  10. Solidworks工程图如何使用,替换图纸格式模板文件

    1 如果你有了图纸模板(SLDDRW文件),比如下面的这个文件,则以后把零件的三维图拖放到里面就可以了.注意,这是最简单,最有效的方法,后面另存为的slddrt文件不好使,所以还不如把模板文件另存为S ...