el-table的上下筛选功能

el-table的sort-change事件可以监听到筛选的事件; 

会返回prop属性和order排序的顺序;

html:

<el-table :data="tableData" border style="width: 100%" :cell-style="{ textAlign: 'center' }"header-cell-class-name="table-th" row-key="id" @sort-change="sortChange"><el-table-column prop="look_number" label="浏览次数" sortable="custom" /><el-table-column prop="number" label="点赞人数" sortable="custom" />
</el-table>

js:

/** * 排序改变
*/
sortChange(e) {let params = {};if (e.prop == "look_number" && e.order && e.order == "ascending") {params.look_number = 1;} else if (e.prop == "look_number" && e.order && e.order == "descending") {params.look_number = 2;} else if (e.prop == "number" && e.order && e.order == "ascending") {params.number = 1;} else if (e.prop == "number" && e.order && e.order == "descending") {params.number = 2;}
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/845610.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

面试题 17.05. 字母与数字(前缀和)

给定一个放有字母和数字的数组&#xff0c;找到最长的子数组&#xff0c;且包含的字母和数字的个数相同。 返回该子数组&#xff0c;若存在多个最长子数组&#xff0c;返回左端点下标值最小的子数组。若不存在这样的数组&#xff0c;返回一个空数组。 示例 1: 输入: ["…

openssl 常用命令demo

RSA Private Key的结构&#xff08;ASN.1&#xff09; RSAPrivateKey :: SEQUENCE { version Version, modulus INTEGER, -- n publicExponent INTEGER, -- e privateExponent INTEGER, -- d prime1 INTEGER, -- …

嵌入式人工智能开发:基于TensorFlow Lite和OpenCV的实时姿态估计算法实现

文章目录 引言环境准备人工智能在嵌入式系统中的应用场景代码示例常见问题及解决方案结论 1. 引言 在嵌入式系统中集成人工智能&#xff08;AI&#xff09;技术已经成为一种重要的发展方向。实时姿态估计是AI在嵌入式领域的一个高级应用&#xff0c;能够在资源受限的环境中实…

海外动态IP代理可以用来批量注册邮箱吗?

无论是个人还是企业&#xff0c;都需要使用邮箱进行沟通、注册账号、接收通知等多种用途。然而&#xff0c;由于互联网服务商为了防止滥用和垃圾邮件的传播&#xff0c;通常对注册邮箱设置了一定的限制&#xff0c;如IP限制、验证码验证等。为了解决这些问题&#xff0c;海外动…

GPT LoRA 大模型微调,生成猫耳娘

往期热门专栏回顾 专栏描述Java项目实战介绍Java组件安装、使用&#xff1b;手写框架等Aws服务器实战Aws Linux服务器上操作nginx、git、JDK、VueJava微服务实战Java 微服务实战&#xff0c;Spring Cloud Netflix套件、Spring Cloud Alibaba套件、Seata、gateway、shadingjdbc…

wpf 实现长时间未操作自动退出登录

思路 在WPF应用程序中实现长时间未操作自动退出&#xff0c;主要思路是先收集用户操作行为&#xff0c;用一个全局变量记录用户最后操作时间&#xff0c;再用一个异步线程去监控用户的最后操作时间和当前时间进行比较如果超过了设定时间认为长时间未操作自动退出登录并显示相关…

关于ida如何进行远程linux调试(详解)

首先我们需要安装工具软件VMware虚拟机和finalshell&#xff0c;并在虚拟机中安装centos 7系统&#xff0c;还要将finalshell连接到该系统中&#xff0c;具体操作可以去b站搜黑马Linux学习&#xff0c;学完该课程的p5&#xff0c;p6&#xff0c;p8即可&#xff0c;我接下来讲的…

[Linux]vsftp配置大全---超完整版

[Linux]vsftp配置大全---超完整版 以下文章介绍Liunx 环境下vsftpd的三种实现方法 一、前言 Vsftp(Very Secure FTP)是一种在Unix/Linux中非常安全且快速稳定的FTP服务器&#xff0c;目前已经被许多大型站点所采用&#xff0c;如ftp.redhat.com,ftp.kde.org,ftp.gnome.org.等。…

js:flex弹性布局

目录 代码&#xff1a; 1、 flex-direction 2、flex-wrap 3、justify-content 4、align-items 5、align-content 代码&#xff1a; <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewp…

Python自然语言处理(NLP)库之NLTK使用详解

概要 自然语言处理(NLP)是人工智能和计算机科学中的一个重要领域,涉及对人类语言的计算机理解和处理。Python的自然语言工具包(NLTK,Natural Language Toolkit)是一个功能强大的NLP库,提供了丰富的工具和数据集,帮助开发者进行各种NLP任务,如分词、词性标注、命名实体…

Excel 将分组头信息填入组内明细行

Excel由多个纵向的分组表组成&#xff0c;组之间由空白行隔开&#xff0c;每组第1、2行的第2格是分组表头&#xff0c;第3行是列头&#xff0c;第1列和第6列数据是空白的&#xff1a; ABCDEF1ATLANTIC SPIRIT2Looe3VesselSpeciesSizeKgDateLocation4POLLACK22.523/04/20245POL…

Flutter 中的 Positioned 小部件:全面指南

Flutter 中的 Positioned 小部件&#xff1a;全面指南 Flutter 是一个由 Google 开发的跨平台 UI 框架&#xff0c;它允许开发者使用 Dart 语言来构建高性能、美观的应用。在 Flutter 的布局系统中&#xff0c;Positioned 是一个用于在父级 Stack 组件中定位子组件的小部件。本…

华为 CANN

华为 CANN 1 介绍1.1 概述1.2 CANN 是华为昇腾计算产业的重要一环1.3 昇腾系列处理器1.4 昇腾 AI 产业1.5 从 AI 算法到产品化落地流程1.6 多样性计算架构1.7 人工智能各层级图示1.8 人工智能技术发展历史 2 CANN vs CUDA支持平台优化方向编程接口生态系统与应用性能与功能 3 C…

SwiftUI中SafeArea的管理与使用(ignoresSafeArea, safeAreaPadding, safeAreaInset)

SafeArea是指不与视图控制器提供的导航栏、选项卡栏、工具栏或其他视图重叠的内容空间。 在UIKit中&#xff0c;开发人员需要使用safeAreaInsets或safeAreaLayoutGuide来确保视图被放置在界面的可见部分。 SwiftUI彻底简化了上述过程&#xff0c;除非开发者明确要求视图突破安…

【工具类】java中自写工具类在实体中直接使用注解进行数据类型转换

目录 一、背景 二、数字 将转字符串转换为整数&#xff0c;并且忽略0 三、字符串转换为整数 四、使用 一、背景 我在项目中前辈的代码中发现了在使用lombok时&#xff0c;可以直接在某个属性上面做限制&#xff0c;然后我就发现这个前辈直接写了限制的工具类&#xff0c;我…

Java—— StringBuilder 和 StringBuffer

1.介绍 由于String的不可更改特性&#xff0c;为了方便字符串的修改&#xff0c;Java中又提供了StringBuilder和Stringbuffer类&#xff0c;这两个类大部分功能是相同的&#xff0c;以下为常用方法&#xff1a; public static void main(String[] args) {StringBuilder sb1 n…

Leecode---347:输出前k个高频元素(使用unordered_map)

题目&#xff1a; 给你一个整数数组 nums 和一个整数 k &#xff0c;请你返回其中出现频率前 k 高的元素。你可以按 任意顺序 返回答案。 思路&#xff1a; 三步&#xff1a; 1、用map来记录每个元素出现的次数 2、按map中的值大小排序&#xff0c;先让其有序&#xff0c;再逆…

百度中心之星

目录 新材料 星际航行 新材料 直接模拟&#xff1a;因为要考虑上次出现的位置&#xff0c;所以使用map映射最好&#xff0c;如果没有出现过就建立新映射&#xff0c;如果出现过但是已经反应过就跳过&#xff0c;如果出现过但是不足以反应&#xff0c;就建立新映射&#xff0c;…

react 怎样配置ant design Pro 路由?

Ant Design Pro 是基于 umi 和 dva 的框架&#xff0c;umi 已经预置了路由功能&#xff0c;只需要在 config/router.config.js 中添加路由信息即可。 例如&#xff0c;假设你需要为 HelloWorld 组件创建一个路由&#xff0c;你可以将以下代码添加到 config/router.config.js 中…

parallels版虚拟机Linux中安装parallels tools报错

按照一个博客的教程安装的可还是安装不了&#xff0c;请指点指点 1.先是输入name -a 输出&#xff1a;Linux user 6.6.9-arm64 #11 SMP Kali 6.6.9-1kali1 (2024-01-08) aarch64GNU/Linux2.按照版本号找对应的文件并下载 第一个文件&#xff1a; linux-headers-6.6.9-arm64_…