js实现多列排序-存在问题
js实现多列排序
根据业务逻辑调整 sortData 的数据。
排序的规则是按照第一列排序,第一列相同按照第二列排序,依次类推
// 要排序的数据
const array = [{ name: '甲'asd, age: 10, money: 100 }, { name: '亿', age: 10, money: 90 }, { name: '丙', age: 9, money: 100 }]
// 排序的顺序,和升序降序 descending,ascending
const sortData = [{ orderColumn: 'age', orderState: 'ascending' }, { orderColumn: 'money', orderState: 'descending' }]
array.sort((a, b) => {
const sortFun = (index) => {
const currentSort = sortData[index]
// 如果当前相同,则递归向下排序
if (a[currentSort.orderColumn] === b[currentSort.orderColumn]) {
// 如果没有下级了,直接按照当前层级进行排序
if (sortData.length - 1 >= index + 1) {
return sortFun(index + 1)
}
}
// 根据排序规则进行排序
if (currentSort.orderState === 'ascending') {
return Number(a[currentSort.orderColumn]) - Number(b[currentSort.orderColumn])
} else {
return Number(b[currentSort.orderColumn]) - Number(a[currentSort.orderColumn])
}
}
// 排序递归方法
return sortFun(0)
})
console.log(array)
js实现多列排序-存在问题的更多相关文章
- 【变态需求】bootstrapTable列排序-选择正序倒序不排序
产品经理:那个table排序能不能点击后弹个选项选择正序倒序不排序? -- 那个是bootstrapTable的插件!不支持!改不了!! 注意:数据上假的,效果看http请求参数进行脑补 这是boot ...
- 使用 JQuery 实现将 table 按照列排序
使用 JQuery 实现将 table 按照列排序 使用 JQuery 实现将 table 按照列排序 代码如下 <!DOCTYPE html> <html> <head ...
- bootstrap列排序
<!DOCTYPE html> <html> <head> <title>Bootstrap 实例 - 列排序</title> <li ...
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 网格系统实例:列排序
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- JS实现前台表格排序功能
JS实现前台表格排序功能 虽然数据量不大的情况下,前台排序速度比较快,但一般情况下,我们的项目只使用后台排序,原因有二: 一是代码简单:二是前台JS排序对于有分页的情况无法处理. 前段时间,有个功能需 ...
- Jtable 表格按多列排序(支持中文汉字排序)
这两天公司让做一个Jtable表格的排序,首先按A列排序,在A列相等时按B列排序,B列相等时按C列排序,ABC三列可以任意指定,最多分三列,这样的一个需求.由于我是大神,所以必须做了出来.ok,不自恋 ...
- easyUI datagraid的列排序
在给datagraid做多列排序时请注意: 首先,做的是后台排序,那么需要设置: remoteSort:'true', 然后,不要添加 multiSort:'true',这个是多列一起排序无法实现.. ...
- EF架构~真正被封装的排序方法,支持多列排序
回到目录 对于linq to sql 和linq to entity来说,当你把获取数据的方法封装了之后,总觉得还缺点什么,想了之后,应该是排序,但看了微软的orchard项目之后,觉得它的排序封装的 ...
- 自定义多列排序:C++/Java实现
前言: 有些时候,我们在编程中会遇到多列排序的需求.假如在execle,这事儿就太easy了.不过没办法,现在就需要你用Java或者C++实现这样一个功能! 比如将下表无序的数据通过重排之后按照以下规 ...
- GridView多列排序
public class WebGridView:GridView { 属性#region 属性 /**//// <summary> /// 是否启用或者禁止多列排序 /// </s ...
随机推荐
- SpringBoot的自动装配原理及应用
什么是SpringBoot自动装配 所谓的"SpringBoot自动装配"就是指:通过注解和一些简单的配置就能将某些组件载入Spring容器环境中,便于使用. 比如,很多sprin ...
- CXP2.0的相机是否可以使用CXP1.1的Grabber
可以 答案是肯定的. 目前CXP共有2个发布版本: 2011年发布CXP1.1 2021年发布CXP2.1,向后兼容,新标准增加了同步功能.数据率放大了一倍. 只要是符合CXP标准.接插件匹配,那么C ...
- 我的第一个项目(九) :飞机大战Vue版本塞到主页
好家伙, 这是未进行分包的vue版本的飞机大战 效果如下: 这里说明一下,大概使用逻辑是提供一个<div> 然后在这<div>中渲染游戏 游戏主界面代码如下: 1 < ...
- DataGear 使用静态HTML模板制作数据可视化看板
DataGear 看板提供了导入静态 HTML 模板的功能,使您可以利用已有的任意 HTML 网页资源快速制作数据可视化看板. 首先,您需要准备一套已设置好布局的静态 HTML 模板,其中包含的 HT ...
- .Net之多语言配置
介绍 支持多语言使网站可以覆盖更广泛的受众. ASP.NET Core 提供的服务和中间件可将网站本地化为不同的语言. 本次示例环境:vs2019.net5 配置 无需引用Nuget包即可实现以下功能 ...
- php的php-fpm
FastCgi与PHP-fpm到底是个什么样的关系 昨晚有一位某知名在线教育的大佬问了我一个问题,你知道php-fpm和cgi之间的关系吗?作为了一个5年的phper了,这个还不是很简单的问题,然后我 ...
- nexus 莫名错误 两个解决的地方
unknown org.sonatype.nexus.reposibory.httpclient.internal.httpclientfaceImpl 也没太解决,先记录下来吧
- Inno setup 脚本判断 Microsoft Visual C++ Redistributable 不同版本区别
有个需要是需要在安装包安装初始化时安装 Microsoft Visual c++ 2013 Redistributable 也就是判断软件安装前需不需要运行 vcredist_x64.exe 和 VC ...
- electron程序运行在某些 windows 上白屏
现象: 打包后的 electron 程序 运行在某些 windows 上白屏 项目情况: vue3.0 项目使用 vue-cli 创建 使用 vue add electron-builder 添加打 ...
- 2、Azure Devops之Azure Boards使用
1.什么是Azure Boards 使用面板.积压工作.冲刺.查询管理项目的用户故事.待办事项.任务.特性和bug. 2.工作项(WorkItem) 工作项管理的可以管理和创建用户故事.特性.任务. ...