sortablejsデータソースを修正した後、対象データが同期されていない問題を修正しました.

2016 ワード

問題があったら、情報を編集する時に得られたデータは何の変更もせずにそのまま保存します.sortableのインスタンスオブジェクトは空です.
解決方法、手動でセットしてください.
setSort() {
      const el = this.$refs.dragTable.$el.querySelectorAll('.el-table__body-wrapper > table > tbody')[0];
      let _this = this;
      this.sortObj = Sortable.create(el, {
        group: "sort-table",
        animation: 150,
        ghostClass: 'blue-background-class',
        dataIdAttr: 'class',
        store: {
          get: function (sortable) {
            var order = localStorage.getItem(sortable.options.group.name);
            return order ? order.split('|') : [];
          },
          set: function (sortable) {
            //            ,    !!!!!!!!!
            var order = sortable.toArray();
            localStorage.setItem(sortable.options.group.name, order.join('|'));
          }
        },
        onEnd({ newIndex, oldIndex }) {
          // let arr = _this.localServicesList;
          // const currRow = _this.localServicesList.splice(oldIndex, 1)[0];
          // _this.localServicesList.splice(newIndex, 0, currRow);
          // _this.$set(_this.$data, 'localServicesList', _this.localServicesList);
        },
        onRemove(evt) {
          
        }
      });
    },


//       ,         ,   let sortArr = localStorage.getItem('sort-table')  ,        store set  
this.sortObj.options.store.set(me.sortObj)// this.sortObj     
let sortArr = localStorage.getItem('sort-table');
let idxs = [];
if(sortArr) {
    sortArr = sortArr.split('|');
    let rst = null;
    sortArr.map(item => {
        rst = item.split(' ').filter(el => el.indexOf('id_')>-1)[0];
        idxs.push(rst.substring(3))
    })
} else {
}
これでデータが手に入ります.
✨✨✨✨✨✨✨✨✨✨✨✨✨✨✨✨✨✨✨✨✨✨✨✨✨✨✨✨✨✨✨✨
遭遇した第二の問題:データソースを切り替える時、初めてcreateのデータは更新されていません.
解決策:
if(this.sortObj) {

    this.sortObj.destroy()

}
this.setSort();//      ?
疑問があればメッセージを残してください