avue-curd 使用sortable-change拖动

最新推荐文章于 2025-04-01 10:40:36 发布

pan²⁰²⁰

最新推荐文章于 2025-04-01 10:40:36 发布

阅读量955

点赞数

CC 4.0 BY-SA版权

分类专栏： avue-curd 文章标签： css html5 linux vue.js

本文链接：https://blog.youkuaiyun.com/qq_30409135/article/details/123878153

avue-curd 专栏收录该内容

1 篇文章

订阅专栏

在使用avue库进行CURD操作时，遇到sortable-change事件触发后数据顺序错误的问题。主要原因是未设置row-key或者row-key存在重复。解决方案是确保每个数据项具有唯一的row-key，并在sortableChange方法中正确处理数据更新，以避免顺序混乱。通过设置this.detailData为更新后的list并禁用/toggle编辑状态来同步视图。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

avue-curd 使用sortable-change拖动顺序会错乱
原因有：
1.未设置row-key
2.row-key 值有重复

@sortable-change="sortableChange"

    sortableChange (oldindex, newindex, row, list) {

        this.detailData = [];
        this.tabsValueDisabled = true
        this.$nextTick(() => {
          this.detailData = list;
          this.tabsValueDisabled = false
          console.log(list)
        });
    },