我在拖动列 vuetify 时做错了什么

问题描述

什么是可排序的?为什么我遇到了问题

This is the problem what I've got

  sortTheHeadersAndUpdateTheKey(evt) {
    const headersTmp = this.headers;
    const oldindex = evt.oldindex;
    const newIndex = evt.newIndex;
    if (newIndex >= headersTmp.length) {
      let k = newIndex - headersTmp.length + 1;
      while (k--) {
        headersTmp.push(undefined);
      }
    }
    headersTmp.splice(newIndex,headersTmp.splice(oldindex,1)[0]);
    this.table = headersTmp;
    this.anIncreasingNumber += 1;
  },},directives: {
  'sortable-table': {
    inserted: (el,binding) => {
      el.querySelectorAll('th').forEach((draggableEl) => {
        // Need a class watcher because sorting v-data-table rows asc/desc removes the sortHandle class
        watchClass(draggableEl,'sortHandle');
        draggableEl.classList.add('sortHandle');
      });
      Sortable.create(el.querySelector('tr'),binding.value ? { ...binding.value,handle: '.sortHandle' } : {});
    },<v-data-table
      :headers="showHeaders"
      :page="page"
      :pageCount="numberOfPages"
      :options.sync="options"
      :loading="loading"
      :server-items-length="totalItems"
      :items="items"
      :items-per-page="15"
      class="mainTable"
      @dblclick:row="editItem"
      v-sortable-table="{onEnd:sortTheHeadersAndUpdateTheKey}"
      :key="anIncreasingNumber"
      :footer-props="{
  showFirstLastPage: true,firstIcon: 'mdi-arrow-collapse-left',lastIcon: 'mdi-arrow-collapse-right',prevIcon: 'mdi-minus',nextIcon: 'mdi-plus'
}"
  >

我只是尝试这样做Dragging columns in a Vuetify v-data-table 但是有一个错误,我做了他所说的一切,但仍然遇到问题我已经安装并导入了 vuedraggable

可能导入错误--->导入'vuedraggable'

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)