vue项目中在表格中实现上移、下移、置顶和置底操作

预备知识：

1. [b,a] = [a,b]：ES6语法，交换数组中两个元素的位置
2. unshift：向数组的开头添加一个或更多元素，并返回新的长度
3. splice：通过删除、替换现有元素、添加新的元素来修改数组的
4. push：向数组的末尾添加一个或更多元素，并返回新的长度

代码如下：

// val值： 上移、下移、置顶、置底
const moveDataIndex = (val, item) => {
    let index = item.index;
    
    // 上移
    if (val == 'moveUp') {
        if (index == 0) {
            Global.Message?.info('当前是第一条');
            return;
        }
        // 交换数组中两个数位置  ES6语法 [b,a] = [a,b];
        [tableData.value[index], tableData.value[index - 1]] = [tableData.value[index - 1], tableData.value[index]];
    }

    // 下移
    if (val == 'shiftDown') {
        if (index == tableData.value.length - 1) {
            Global.Message?.info('当前是最后一条');
            return;
        }
        [tableData.value[index + 1], tableData.value[index]] = [tableData.value[index], tableData.value[index + 1]];
    }

    // 置顶
    if (val == 'top') {
        if (index == 0) {
            Global.Message?.info('已经是第一条了');
            return;
        }
        tableData.value.splice(item.index, 1);
        tableData.value.unshift(item);
    }

    // 置底
    if (val == 'bottom') {
        if (index == tableData.value.length - 1) {
            Global.Message?.info('已经是最后一条了');
            return;
        }
        tableData.value.splice(item.index, 1);
        tableData.value.push(item);
    }
}