当前位置: 首页 > news >正文

ant-design-vue 3 a-table保留选中状态

业务需求需要保留选中状态

	 <a-table class="satistic-table" :row-selection="{ selectedRowKeys: selectedRowKeys, onSelect:onSelect,onSelectAll:onSelectAll }" :row-key="(row)=>{ return row.customerId}" :columns="columns" :data-source="tableData" ></a-table>
	const selectedRowKeys = ref([])//选择行const onSelect = (record, selected, selectedRows) => {if (selected) {selectedRowKeys.value = [record.customerId, ...selectedRowKeys.value]} else {selectedRowKeys.value = selectedRowKeys.value.filter((item) => item !== record.customerId)}}// 点击全选按钮const onSelectAll = (selected, selectedRows, changeRows) => {if (selected) {selectedRowKeys.value = [...selectedRowKeys.value, ...changeRows.map((item) => item.customerId)]} else {selectedRowKeys.value = selectedRowKeys.value.filter((item) => !changeRows.map((item) => item.customerId).includes(item))}}

最终结果,翻页不丢失key
selectedRowKeys : 所有选择key

相关文章:

ant-design-vue 3 a-table保留选中状态

业务需求需要保留选中状态 <a-table class"satistic-table" :row-selection"{ selectedRowKeys: selectedRowKeys, onSelect:onSelect,onSelectAll:onSelectAll }" :row-key"(row)>{ return row.customerId}" :columns"columns"…...

golang 工程组件:grpc-gateway option自定义http规则

option自定义http规则和http body响应 简介 本篇接上文 golang 工程组件&#xff1a;grpc-gateway 环境安装默认网关测试 默认网关配置终究是难用&#xff0c;本篇介绍一下proto里采用option自定义http规则以及让网关返回http响应而不是我们定义的grpc响应 option定义http…...

亚马逊添加购物车和收藏有什么区别

亚马逊的添加购物车和收藏是两个不同的功能&#xff0c;它们在用户行为和用途上有明显的区别&#xff1a; 1、添加购物车&#xff08;Add to Cart&#xff09;&#xff1a; 当用户点击"添加到购物车"按钮时&#xff0c;所选商品将被放入他们的购物车&#xff0c;而…...

JAVA-编程基础-11-03-java IO 字节流

Lison <dreamlison163.com>, v1.0.0, 2023.05.07 JAVA-编程基础-11-03-java IO 字节流 文章目录 JAVA-编程基础-11-03-java IO 字节流字节输出流&#xff08;OutputStream&#xff09;FileOutputStream类**FileOutputStrea 的构造方法**使用文件名创建FileOutputStream…...

python之Cp、Cpk、Pp、Ppk

目录 1、Cp、Cpk、Pp、Ppk 2、python计算 1、Cp、Cpk、Pp、Ppk Cp Process Capability Ratio 可被译为“过程能力指数” Cpk Process Capability K Ratio 可被译为“过程能力K指数” Pp Process Performance Ratio 可被译为“过程绩效指数” Ppk Process Performance K Ra…...

统信uos 1030 企业版 安装.net core环境

安装.net core步骤 添加密钥和包存储库 安装 .NET 之前&#xff0c;请运行以下命令&#xff0c;将 Microsoft 包签名密钥添加到受信任密钥列表&#xff0c;并添加包存储库wget https://packages.microsoft.com/config/debian/10/packages-microsoft-prod.deb -O packages-mic…...

2023/10/23学习记录

1.VS2019中sln对应解决方案 修改sln的文件名&#xff0c;对应的解决方案名称也会变化。 2.如何修改生成的exe文件名呢&#xff1f; 属性--->杂项--->&#xff08;名称) 3.这是任务管理器&#xff0c;这里红色部分显示的是“这是文件描述”。 当通过属性查看详细信息的时…...

flask入门(四)前后端数据传输

文章目录 1、flask后端接收来自前端的数据1&#xff09;如果前端提交的方法为POST2&#xff09;如果前段提交的方法是GET 2、flask后端向前端传数据3、案例参考文献 1、flask后端接收来自前端的数据 1&#xff09;如果前端提交的方法为POST 后端接收时的代码&#xff1a; xx…...

JS——垃圾回收的原理

引言 JavaScript是一种高级的、解释型的编程语言&#xff0c;广泛应用于网页开发和移动应用开发中。在JavaScript中&#xff0c;内存管理是一个重要的话题&#xff0c;而垃圾回收就是内存管理的一部分。本文将介绍JavaScript垃圾回收的原理&#xff0c;并提供一些示例代码来帮助…...

Spring Cloud Gateway 路由构建器的源码分析

Spring Cloud Gateway 路由构建器的源码分析 文章目录 1. 路由构建器的入口2. 创建路由规则3. 设置路由规则和属性4. 路由过滤器的设置5. 构建和获取路由规则&#xff1a;6. 实例化路由构建器&#xff1a;8. 路由构建器的源码分析8.1 RouteLocator接口8.2 RouteLocatorBuilder…...

IT行业哪个方向比较好就业?

IT行业哪个方向比较好就业? IT行业里&#xff0c;哪些方向更好就业&#xff0c;这是一个很常见也很重要的问题。不同的IT方向有不同的技能要求、就业前景和发展空间&#xff0c;因此需要根据自己的兴趣、能力和目标来选择合适的方向。 软件开发与工程&#xff1a;软件开发是…...

uniapp中nvue页面使用fixed后,数据更改不更新到该视图。

解决方案&#xff1a;position: fixed;定位改成position: absolute; 记录一下&#xff0c;遇到这个贼离谱的问题&#xff0c;uniapp项目里的nvue页面因为要弄个引导蒙版&#xff0c;所以使用了fixed定位&#xff0c;点击蒙版关闭&#xff0c;加了this.$forceUpdate()也不行&am…...

力扣第55题 跳跃游戏 c++ 贪心 + 覆盖 加暴力超时参考

题目 55. 跳跃游戏 中等 相关标签 贪心 数组 动态规划 给你一个非负整数数组 nums &#xff0c;你最初位于数组的 第一个下标 。数组中的每个元素代表你在该位置可以跳跃的最大长度。 判断你是否能够到达最后一个下标&#xff0c;如果可以&#xff0c;返回 true &…...

系列十四、Redis的集群(一)

一、是什么 1.1、概述 由于数据量过大&#xff0c;单个master-slave模式难以承担&#xff0c;当出现master节点故障的一瞬间&#xff0c;哨兵重新选举新的master节点之前&#xff0c;这一小段时间将会导致Redis服务不可用&#xff0c;因此需要对多个master-slave主从复制集进行…...

红帽认证 | RHCE考试包括哪些内容?

Red Hat Certified Engineer&#xff08;RHCE&#xff09;考试是一项面向企业级系统管理员的认证考试&#xff0c;是认证Linux系统管理员技能的一种方式。 RHCE证书是Linux管理员领域中最受欢迎和最受认可的证书之一。 那RHCE考试都有哪些内容呢&#xff0c;一起来看看吧&…...

ASPICE标准快速掌握「3.1. 实践示例」

实践示例 本章内容是最重要的,建议慢下来跟着博主的思路一步一步前进 1. 示例背景说明 假设我们现在是一个Tier1的车窗控制软件开发商,我们给OEM提供软件解决方案 1.1. 本过程目标 根据客户、上级部门、安全团队与质量团队等提出的要求,本项目要求SYS.1过程达到ASPICE过…...

pytorch 训练可视化

pytorch 训练可视化 1.from torch.utils.tensorboard 1.from torch.utils.tensorboard from torch.utils.tensorboard import SummaryWriter在最新版本的pytorch中官方提供了tensorboard的api。以下是官方教程的链接 https://pytorch.org/tutorials/intermediate/tensorboard…...

webgis开发参考资料

一、ArcGIS相关 1、ArcGIS for Server 10.3.X 新型紧凑型缓存的解读和应用 http://zhihu.geoscene.cn/article/1038 2、arcgis server 紧促&#xff08;bundle&#xff09;格式缓存文件的读取 https://blog.csdn.net/abc553226713/article/details/8668839 3、ArcGIS 10.0紧…...

JSX 注意事项

学习目标&#xff1a; 掌握 JSX 实际开发过程中的一些注意事项   1. JSX 必须具有一个根节点&#xff0c;如果没有根节点可以使用<></>(幽灵节点)代替根节点将所有元素包裹起来 function App() {return (<><div className"App">1</div&…...

MQ常见的问题(kafka保证消息不丢失)

MQ常见的问题 1&#xff0c;mq如何避免消息堆积问题。 消息堆积&#xff1a;生产者的生产速率远远大于消费者的消费速率&#xff0c;使消息大批量的堆积在消息队列。 解决方案&#xff1a;1&#xff0c;提升消费者的消费速率&#xff08;增加消费者集群&#xff09; 2&…...

手游刚开服就被攻击怎么办?如何防御DDoS?

开服初期是手游最脆弱的阶段&#xff0c;极易成为DDoS攻击的目标。一旦遭遇攻击&#xff0c;可能导致服务器瘫痪、玩家流失&#xff0c;甚至造成巨大经济损失。本文为开发者提供一套简洁有效的应急与防御方案&#xff0c;帮助快速应对并构建长期防护体系。 一、遭遇攻击的紧急应…...

基于uniapp+WebSocket实现聊天对话、消息监听、消息推送、聊天室等功能,多端兼容

基于 ​UniApp + WebSocket​实现多端兼容的实时通讯系统,涵盖WebSocket连接建立、消息收发机制、多端兼容性配置、消息实时监听等功能,适配​微信小程序、H5、Android、iOS等终端 目录 技术选型分析WebSocket协议优势UniApp跨平台特性WebSocket 基础实现连接管理消息收发连接…...

STM32F4基本定时器使用和原理详解

STM32F4基本定时器使用和原理详解 前言如何确定定时器挂载在哪条时钟线上配置及使用方法参数配置PrescalerCounter ModeCounter Periodauto-reload preloadTrigger Event Selection 中断配置生成的代码及使用方法初始化代码基本定时器触发DCA或者ADC的代码讲解中断代码定时启动…...

转转集团旗下首家二手多品类循环仓店“超级转转”开业

6月9日&#xff0c;国内领先的循环经济企业转转集团旗下首家二手多品类循环仓店“超级转转”正式开业。 转转集团创始人兼CEO黄炜、转转循环时尚发起人朱珠、转转集团COO兼红布林CEO胡伟琨、王府井集团副总裁祝捷等出席了开业剪彩仪式。 据「TMT星球」了解&#xff0c;“超级…...

Spring Boot面试题精选汇总

&#x1f91f;致敬读者 &#x1f7e9;感谢阅读&#x1f7e6;笑口常开&#x1f7ea;生日快乐⬛早点睡觉 &#x1f4d8;博主相关 &#x1f7e7;博主信息&#x1f7e8;博客首页&#x1f7eb;专栏推荐&#x1f7e5;活动信息 文章目录 Spring Boot面试题精选汇总⚙️ **一、核心概…...

WordPress插件:AI多语言写作与智能配图、免费AI模型、SEO文章生成

厌倦手动写WordPress文章&#xff1f;AI自动生成&#xff0c;效率提升10倍&#xff01; 支持多语言、自动配图、定时发布&#xff0c;让内容创作更轻松&#xff01; AI内容生成 → 不想每天写文章&#xff1f;AI一键生成高质量内容&#xff01;多语言支持 → 跨境电商必备&am…...

OpenLayers 分屏对比(地图联动)

注&#xff1a;当前使用的是 ol 5.3.0 版本&#xff0c;天地图使用的key请到天地图官网申请&#xff0c;并替换为自己的key 地图分屏对比在WebGIS开发中是很常见的功能&#xff0c;和卷帘图层不一样的是&#xff0c;分屏对比是在各个地图中添加相同或者不同的图层进行对比查看。…...

云原生安全实战:API网关Kong的鉴权与限流详解

&#x1f525;「炎码工坊」技术弹药已装填&#xff01; 点击关注 → 解锁工业级干货【工具实测|项目避坑|源码燃烧指南】 一、基础概念 1. API网关&#xff08;API Gateway&#xff09; API网关是微服务架构中的核心组件&#xff0c;负责统一管理所有API的流量入口。它像一座…...

scikit-learn机器学习

# 同时添加如下代码, 这样每次环境(kernel)启动的时候只要运行下方代码即可: # Also add the following code, # so that every time the environment (kernel) starts, # just run the following code: import sys sys.path.append(/home/aistudio/external-libraries)机…...

前端中slice和splic的区别

1. slice slice 用于从数组中提取一部分元素&#xff0c;返回一个新的数组。 特点&#xff1a; 不修改原数组&#xff1a;slice 不会改变原数组&#xff0c;而是返回一个新的数组。提取数组的部分&#xff1a;slice 会根据指定的开始索引和结束索引提取数组的一部分。不包含…...