經過拖動列表，從新獲取列表的排序

文章首發在個人 我的博客上

有這樣一個列表：

須要拖動列表，改變順序，並把新的順序保存下來傳給後端。

實現實現方法以下：

function arrSort(arr,oldIndex,newIndex){
  //  oldIndex是當前元素下標，newIndex是拖動到的位置下標。

  //若是當前元素在拖動目標位置的下方(即把該元素向上拖)，
  //先給數組中元素拖動到的地方（即索引爲newIndex的位置）新增一個和當前拖動元素值同樣的元素，
  //而後再把數組中以前的那個拖動的元素刪除掉，由於前面插入了一個元素，因此數組長度要+1
  if(oldIndex > newIndex){
    arr.splice(newIndex,0,arr[oldIndex]);
    arr.splice(oldIndex+1,1)
  } else {
  //若是當前元素在拖動目標位置的上方(即把該元素向下拖)，
  //一樣，給數組newIndex+1的地方新增一個和當前元素值同樣的元素，
  //這時，將以前的那個拖動的元素刪除掉，索引不變，仍是oldIndex
    arr.splice(newIndex+1,0,arr[oldIndex]);
    arr.splice(oldIndex,1)
  }
}

最終總結就一句話：先在新的位置添加一個元素，而後再把原來的元素刪掉！

至於如何得到 ==newIndex== 和 ==oldIndex== ？

咱們項目使用的vue，這個拖拽用的一個庫：Vue.Draggable，

經過這個組件提供的方法，就能同時獲取newIndex和oldIndex；

其餘方法：++拖拽前、後 都遍歷下這個列表，應該也能拿到列表中元素的排序++（該方法何嘗試）