拖拽表格的行后,怎么维持第一列就是id不变?

发布于 2022-09-13 00:51:15 字数 577 浏览 27 评论 0

在网上找了一段代码实现了表格的行拖拽
sortlist() {

  const tbody = document.querySelector('.el-table__body-wrapper tbody')
  const _this = this
  Sortable.create(tbody, {
    onEnd({ newIndex, oldIndex }) {
      const currRow = _this.newsList.splice(oldIndex, 1)[0]
      _this.newsList.splice(newIndex, 0, currRow)
    }
  })
},

mounted() {
this.sortlist()

},

image.png 拖拽后变成了image.png

有什么方法能让第一列的id保持不变吗 只让后面的内容改变 id是我scope.$index生成的

求解

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

苍白女子 2022-09-20 00:51:15

拖动完成遍历数组更新 id

过期情话 2022-09-20 00:51:15

使用的sortablejs吧,这个文档有点问题,最新的貌似api变动了,和很多的写的不一样了。

我这里建议把onEnd换成onUpdate,另外table的rowKey(就是每一行的key)不能设置为index(拖拽时index会变动,移除和添加时数组的索引会变),需要使用单独的key(newsList里拿吧,是后端数据直接用后端id),不然拖拽数据更新渲染会有问题

 onUpdate(event) {
      const currRow = _this.newsList.splice(event.oldDraggableIndex, 1)[0]
      _this.newsList.splice(event.newDraggableIndex, 0, currRow)
    }
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文