如何在vue中使用sortablejs的destory()方法

Question

// 行拖拽
    rowDrop() {
      const tbody = document.getElementById('crTable').querySelector('.el-table__body-wrapper tbody')
      this.sorTable()
      const that = this
      var sortable = Sortable.create(tbody, {
        disabled: that.state,
        onEnd({ newIndex, oldIndex }) {
          const currRow = that.articleList.splice(oldIndex, 1)[0]
          that.articleList.splice(newIndex, 0, currRow)
          let rank = {}
          that.articleList.forEach((element, index) => {
            element.rank = index + 1
            rank = Object.assign(rank, {
              [element.id]: element.rank
            })
          })
          const data = {
            items: rank
          }
          articleSort(data).then(response => {
            that.$message.success('更改成功')
          })
        }
      })
      console.log(sortable.option('disabled'))
      console.log(this.state)
    }

Answer 1

// 行拖拽
    rowDrop() {
      const tbody = document.getElementById('crTable').querySelector('.el-table__body-wrapper tbody')
      this.sorTable()
      const that = this
      that.sortable && that.sortable.destroy()
      that.sortable = Sortable.create(tbody, {
        disabled: that.state,
        onEnd({ newIndex, oldIndex }) {
          const currRow = that.articleList.splice(oldIndex, 1)[0]
          that.articleList.splice(newIndex, 0, currRow)
          let rank = {}
          that.articleList.forEach((element, index) => {
            element.rank = index + 1
            rank = Object.assign(rank, {
              [element.id]: element.rank
            })
          })
          const data = {
            items: rank
          }
          articleSort(data).then(response => {
            that.$message.success('更改成功')
          })
        }
      })
      console.log(this.state)
    }