ES6中对数组的数据进行排序
今天在工作中遇到了要对多选数据进行排序的一个功能,在此学习记录一下。
实现效果:点击左边的向下或者向上排序的按钮实现数据的排序。

选择第二个向下排序,结果如下:


具体方法如下:
//找到原来需要排序的数据在原来的数组中的位置
const index=$this.checkedCities.findIndex((item)=>{
return item==row;
});
//向上排序
if(isUp){
[$this.checkedCities[index],$this.checkedCities[index-1]]=[$this.checkedCities[index-1],$this.checkedCities[index]]
}else{
[$this.checkedCities[index],$this.checkedCities[index+1]]=[$this.checkedCities[index+1],$this.checkedCities[index]]
}
ES6中对数组的数据进行排序的更多相关文章
- ES6中的数组
数组是js中很重要的数据类型,虽然在 ES5 中,关于数组的方法和属性很多.但为了更加简洁.高效的操作数组,ES6 中又在数组原型上和实例上新增了一些方法. 一.Array方法 1.1 Array.f ...
- B表中的pid对应A表中id,查询A表中数据,根据b表中对应a表中该id的数据数目排序
B表中的pid对应A表中id,查询A表中数据,根据b表中对应a表中该id的数据数目排序 select a.*,count(*) as c from a left join b on a.id=b.ai ...
- ES6中对数组的扩展
hello,大家好,我又来了. 前面讲了字符串和数值的扩展,今天要讲的是:数组的扩展.不知道大家能否跟得上这个节奏,你们在阅读中对讲解有存在疑惑,记得留言提出来,要真正地理解,否则白白 ...
- ES6中的数组方法扩展
上一篇文章小编简单介绍了在ES6中,一些常用的方法和一些简单的应用,在这篇文章中,小编将针对ES6中数组常用方法进行扩展,相信经过这篇文章之后,每一位小伙伴下班时间会有所提前,就算从原来的996变成9 ...
- ES6中的数组常用方法
数组在JS中虽然没有函数地位那么高,但是也有着举足轻重的地位,下面我就结合这ES5中的一些常用的方法,与ES6中的一些方法做一些说明和实际用途.大家也可以关注我的微信公众号,蜗牛全栈. 一.ES5中数 ...
- C语言链表中数组实现数据选择排序,升序、降序功能主要难点
链表排序讲解: head指针指向链表的头结点,是找到整个链表的唯一依据,如果head指针丢失,整个链表就找不到了. head存储的是第一个节点的地址,head->next存储的是第二个节点的地址 ...
- JAVA中运用数组的四种排序方法
JAVA中在运用数组进行排序功能时,一般有四种方法:快速排序法.冒泡法.选择排序法.插入排序法. 快速排序法主要是运用了Arrays中的一个方法Arrays.sort()实现. 冒泡法是运用遍历数组进 ...
- AJPFX关于Java中运用数组的四种排序方法
JAVA中在运用数组进行排序功能时,一般有四种方法:快速排序法.冒泡法.选择排序法.插入排序法.快速排序法主要是运用了Arrays中的一个方法Arrays.sort()实现.冒泡法是运用遍历数组进行比 ...
- Java基础知识强化12:Java中运用数组的四种排序方法
1.使用JavaApi文档中的Arrays类中的sort()进行快速排序 首先我们直接看代码如下: package himi.text; import java.util.Arrays; public ...
- ES6中的数组reduce()方法详解
reduce() 方法对数组中的每个元素执行一个由我们提供的reducer函数(升序执行),将其结果汇总为单个返回值. 1. 语法reduce说明 arr.reduce(callback(accumu ...
随机推荐
- Linux 错误码
背景 Linux的错误码包含在/usr/include/asm-generic/errno-base.h和/usr/include/asm-generic/errno.h 这两个文件内. 可用于查询. ...
- mysql查看用户的过期时间
1. mysql查看用户的过期时间的方法 在MySQL中,用户的过期时间(也称为账户过期日期)是一个可选项,用于确定某个MySQL用户账户何时到期.但是,值得注意的是,并非所有的MySQL安装或版本都 ...
- PHP 真的不行了?透过 PHP 的前世今生看真相
大家好,我是码农先森. 1994年我出生在湖南的农村,就在同年加拿大的拉斯姆斯·勒多夫创造了 PHP,这时的 PHP 还只是用 Perl 编写的 CGI 脚本.或许是时间的巧合 PHP 变成了我后半生 ...
- Advanced .Net Debugging 10:事后调试
一.介绍 这是我的<Advanced .Net Debugging>这个系列的第十篇文章.这篇文章的内容是原书的第三部分的[高级主题]的第八章[事后调试].前面几篇文章,我们介绍了很多工具 ...
- ubuntu20使用php+apache+adminer搭建mysql网页管理工具
前言 使用 php7+apache2+adminer 搭建网页版mysql管理工具,现将自己的搭建过程记录下来,留作后续参考.可参考其中配置,由于只配置了一次环境,可能有的步骤是多余的,后续可能会 ...
- Java常见问题-多线程
现在有 T1.T2.T3 三个线程,你怎样保证 T2 在 T1 执行完后执行,T3 在 T2 执行完后执行? 这个多线程问题比较简单,可以用 join 方法实现. 在 Java 中 Lock 接口比 ...
- 什么是JS执行上下文?
我们都知道,JS代码的执行顺序总是与代码先后顺序有所差异,当先抛开异步问题你会发现就算是同步代码,它的执行也与你的预期不一致,比如: function f1() { console.log('听风是风 ...
- MoneyPrinterPlus全面支持本地Ollama大模型
MoneyPrinterPlus现在支持批量混剪,一键AI生成视频,一键批量发布短视频这些功能了. 之前支持的大模型是常用的云厂商,比如OpenAI,Azure,Kimi,Qianfan,Baichu ...
- 基于Java:流浪动物领养信息系统设计实现(源码+lw+部署文档+讲解等)
\n文末获取源码联系 感兴趣的可以先收藏起来,大家在毕设选题,项目以及论文编写等相关问题都可以给我加好友咨询 系统介绍: 现代经济快节奏发展以及不断完善升级的信息化技术,让传统数据信息的管理升级为软件 ...
- oeasy教您玩转vim - 24 - 自定颜色
自定颜色 回忆上节课内容 这次我们研究了配色方案 找到了 colors 的位置 下载并应用了颜色方案 制作了自己的配色方案 下面我想修改配色方案的颜色 是否能成功??? 首先得有自己的颜色方案 #找到 ...