《ElementUI/Plus 踩坑》el-table + sortablejs 拖拽顺序错乱(Vue2/3适用)

如图所示:

  • 把第一行拖到最后一行,鼠标up
  • 该行莫名其妙的跳到倒数第二行;

最后发现没有设置 el-table 属性 row-key ,即行数据的 Key,用来优化 table 的渲染;
在这里插入图片描述

属性 row-key 描述如下:
在这里插入图片描述
一定要设置

<el-table class="my-table" :data="tableData" style="width: 100%" row-key="id"><el-table-column prop="date" label="Date" width="180" /><el-table-column prop="name" label="Name" width="180" /><el-table-column prop="address" label="Address" />
</el-table>

PS:如果想进一步了解如何实现,请移步 《ElementUI/Plus:el-table + sortablejs 实现 row 拖动改变顺序(Vue2/3适用)》

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

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

相关文章

YOLOv10轻量化快速涨点之改进AKConv

目录 1,什么是AKConv? 2,如何使用AKConv使YOLOv10快速长点? 2.1,在ultralytics-main/ultralytics/nn/modules/conv.py里面添加AKConv类 2.2,ultralytics-main/ultralytics/nn/modules/conv.py添加如下 2.3 在E:\czc\YOLOv10\ultralytics-main\ultralytics\nn\tasks.p…

算法.图论-并查集上

文章目录 1. 并查集介绍2. 并查集的实现2.1 实现逻辑2.2 isSameSet方法2.3 union方法(小挂大优化)2.4 find方法(路径压缩优化) 3. 并查集模板 1. 并查集介绍 定义&#xff1a; 并查集是一种树型的数据结构&#xff0c;用于处理一些不相交集合的合并及查询问题&#xff08;即所…

1 elasticsearch安装

【0】官网参考 https://www.elastic.co/guide/en/elasticsearch/reference/7.11/targz.html 【1】Centos7 下载安装 【1.1】下载 官网&#xff1a;Download Elasticsearch | Elastic 选择好自己想要的相关版本即可&#xff1b; 【2】Centos7.X 前置环境配置&#xff08;uli…

秦时明月6.2魔改版+GM工具+虚拟机一键端

今天给大家带来一款单机游戏的架设&#xff1a;秦时明月。 另外&#xff1a;本人承接各种游戏架设&#xff08;单机联网&#xff09; 本人为了学习和研究软件内含的设计思想和原理&#xff0c;带了架设教程仅供娱乐。 教程是本人亲自搭建成功的&#xff0c;绝对是完整可运行…

【Vmware16安装教程】

&#x1f4d6;Vmware16安装教程 ✅1.下载✅2.安装 ✅1.下载 官网地址&#xff1a;https://www.vmware.com/ 百度云盘&#xff1a;Vmware16下载 123云盘&#xff1a;Vmware16下载 ✅2.安装 1.双击安装包VMware-workstation-full-16.1.0-LinuxProbe.Com.exe&#xff0c;点击…

最新动态一致的文生视频大模型FancyVideo部署

FancyVideo是一个由360AI团队和中山大学联合开发并开源的视频生成模型。 FancyVideo的创新之处在于它能够实现帧特定的文本指导&#xff0c;使得生成的视频既动态又具有一致性。 FancyVideo模型通过精心设计的跨帧文本引导模块&#xff08;Cross-frame Textual Guidance Modu…

C#和数据库高级:抽象类和抽象方法

文章目录 一、为什么使用抽象类和抽象方法&#xff1f;1.1、父类与子类的相互转换 二、抽象类和抽象方法2.1、抽象类的定义和方法声明规范2.2、使用继承多态的机制解决问题 三、抽象类的概念和使用特点总结 一、为什么使用抽象类和抽象方法&#xff1f; 1.1、父类与子类的相互…

考研数据结构——C语言实现有向图邻接矩阵

首先&#xff0c;定义了一些基本的数据结构和常量&#xff1a; VertexType&#xff1a;顶点的数据类型&#xff0c;这里定义为char。EdgeType&#xff1a;边的数据类型&#xff0c;这里定义为int&#xff0c;用于存储权重。MAXVEX&#xff1a;定义了图中最大顶点数为100。INFIN…

C语言——自定义类型

目录 结构体 概念 结构体变量的创建和初始化 结构体的自引用 结构体的内存对齐 内存对齐存在的原因 合理设计结构体 方法一 方法二 结构体传参 结构体实现位段 什么是位段 位段的内存分配 位段的跨平台问题 注意 联合体 概念 验证 优点 小应用 什么是大小…

【Unity】对象池 - 未更新完

自定义泛型对象池 文章目录 自定义泛型对象池封装泛型类例子 使用Unity自带对象池 封装泛型类 public abstract class MyPool<T> : MonoBehaviour where T :Component {[SerializeField] protected T prefab; // 生成的预制体[SerializeField] protected int defaultNum…

鸿蒙环境服务端签名直传文件到OSS

本文介绍如何在鸿蒙环境下将文件上传到OSS。 背景信息 鸿蒙环境是当下比较流行的操作环境&#xff0c;与服务端签名直传的原理类似&#xff0c;鸿蒙环境上传文件到OSS是利用OSS提供的PutObject接口来实现文件上传到OSS。关于PutObject的详细介绍&#xff0c;请参见PutObject。…

VMware安装飞牛私有云fnOS并挂载小雅Alist实现异地远程访问

&#x1f49d;&#x1f49d;&#x1f49d;欢迎来到我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里可以感受到一份轻松愉快的氛围&#xff0c;不仅可以获得有趣的内容和知识&#xff0c;也可以畅所欲言、分享您的想法和见解。 推荐:kwan 的首页,持续学…

记一次键盘f2和f5键被自动触发情况

背景&#xff1a; 联想小新笔记本电脑内置键盘&#xff0c;其中f2键和f5键一直被自动触发&#xff0c;已尝试过更换输入法&#xff0c;重装系统&#xff0c;拆开键帽清灰依旧无效。考虑维修费或者更换键盘&#xff08;内置&#xff09;费都挺贵的&#xff0c;而且f2和f5作用也…

Unity教程(十六)敌人攻击状态的实现

Unity开发2D类银河恶魔城游戏学习笔记 Unity教程&#xff08;零&#xff09;Unity和VS的使用相关内容 Unity教程&#xff08;一&#xff09;开始学习状态机 Unity教程&#xff08;二&#xff09;角色移动的实现 Unity教程&#xff08;三&#xff09;角色跳跃的实现 Unity教程&…

2024java面试-软实力篇

为什么说简历很重要&#xff1f; 一份好的简历可以在整个申请面试以及面试过程中起到非常好的作用。 在不夸大自己能力的情 况 下&#xff0c;写出一份好的简历也是一项很棒的能力。为什么说简历很重要呢&#xff1f; 、 先从面试来说 假如你是网申&#xff0c;你的简历必然…

论文阅读-《Attention is All You Need》

注意力就是一切 【要点】&#xff1a;论文提出了一种全新的网络架构——Transformer&#xff0c;完全基于注意力机制&#xff0c;无需使用循环和卷积&#xff0c;实现了在机器翻译任务上的性能提升和训练效率的显著提高。 【方法】&#xff1a;通过构建一个仅使用注意力机制的…

【计算机网络 - 基础问题】每日 3 题(十三)

✍个人博客&#xff1a;Pandaconda-CSDN博客 &#x1f4e3;专栏地址&#xff1a;http://t.csdnimg.cn/fYaBd &#x1f4da;专栏简介&#xff1a;在这个专栏中&#xff0c;我将会分享 C 面试中常见的面试题给大家~ ❤️如果有收获的话&#xff0c;欢迎点赞&#x1f44d;收藏&…

cadence SPB17.4 - allegro - 用板子外形创建整板铺铜

文章目录 cadence SPB17.4 - allegro - 用板子外形创建整板铺铜概述笔记先确定自己板子的 board Geometry/Design_Outline 是否有外形shape为了将软件提示看得更清楚&#xff0c;在每个操作之前&#xff0c;先将命令提示区内容先删了用Z-copy从外形层生成整板的铺铜备注END cad…

【JS】postMessage与MessageChannel

前言 postMessage 和 MessageChannel 都是用来实现跨文档、跨窗口或跨线程&#xff08;Web Worker&#xff09;的消息传递机制。 postMessage 可以在 iframe、同源或跨源窗口之间传递数据&#xff0c;也可以用于主线程与 Web Worker 之间的通信。 postMessage 是一种单向的…

数据结构-3.1.栈的基本概念

一.栈的定义&#xff1a; 栈和线性表的区别&#xff1a;栈只能在表尾一端进行插入或者删除的操作&#xff0c;而线性表可以在任意一个地方进行插入或者删除 二.有关栈的关键术语&#xff1a; 三.栈的基本操作&#xff1a; 1.回顾线性表的基本操作&#xff1a; 2.栈的基本操作&…