NG-ZORRO中table改變表格的兩行的位子，上移，下移，置頂

由於ant-zorro組件庫裏的表格，直接使用splice修改無法生效

 

需要稍微改下寫法

這裏是定義方法的地方,依舊使用的是splice和unshift方法

/**
 * @description 數組兩個元素換位子
 * @param arr 傳入的數組，index1，index2 交換位置的元素
 */
export function swapArr(arr: any[], index1: number, index2: number) {
  arr[index1] = arr.splice(index2, 1, arr[index1])[0];
  return arr;
}

/**
 * @description 數組元素置頂
 * @param arr 傳入的數組，index 置頂元素位置
 */
export function toFirst(arr: any[], index: number) {
  if (index !== 0) {
    arr.unshift(arr.splice(index, 1)[0]);
    return arr;
  }
}

下面調用方法

/**
 * @description 上移一位
 * @param index 上移的元素下標
 */
public moveUp(index) {
    if (index === 0) {
      this.message.warning("最頂部的無法上移");
    } else {
      let listdata = swapArr(this.listOfToTopData, index, index - 1);
      this.listOfToTopData = this.listOfToTopData.map(item => {
        return {
          ...item,
        };
      });
    }
  }

/**
 * @description 下移一位
 * @param index 下移的元素下標
 */
  public moveDown(index) {
    if (index === this.listOfToTopData.length - 1) {
      this.message.warning("最底部的無法下移");
    } else {
      let listdata = swapArr(this.listOfToTopData, index, index + 1);
      this.listOfToTopData = this.listOfToTopData.map(item => {
        return {
          ...item,
        };
      });
    }
  }

/**
 * @description 置頂元素
 * @param index 置頂的元素下標
 */
  public toTop(index) {
    if (index === 0) {
      this.message.warning("數據已經置頂");
    } else {
      let listdata = toFirst(this.listOfToTopData, index);
      this.listOfToTopData = this.listOfToTopData.map(item => {
        return {
          ...item,
        };
      });
    }
  }

這裏的listOfToTopData 就是需要操作的數組元素。

能實現效果。