数组随意排序(vue3.0 + TS)
vue3.0中使用TS数组获取相邻项数据
// 封装TS方法
const judegObjectArr = (value: any, key: string, arr: any, type: any) => {
let list = [];
let data = "";
// 保存数组最长长度
let length = arr.length;
// 保存已判断出的id的下标
let index = -1;
for (let i = 0; i < arr.length; i++) {
let obj = arr[i];
if (obj[key] == value) {
index = i;
}
}
// 判断index -1则为不存在
if (index == -1) {
return [];
}
// 没有被返回 向下判断
let upper = index - 1;
let next = index + 1;
// 判断是否相邻是否存在
// type 传入类型 1为向上,2为向下
if (type == 1) {
if (upper >= 0) {
data = arr[upper];
}
} else {
if (next < length) {
data = arr[next];
}
}
return data;
};
// 定义数组
const state = reactive({
listData= [
{id:1,name:"js"}
{id:2,name:"java"}
{id:5,name:"php"}
{id:6,name:"c"}
{id:8,name:"node"}
]
})
// 点击向下排序事件
const downList = (e: any) => {
// 调用方法,获取数组相邻项数据
let datas = judegObjectArr(e, "id", state.listData, "2");
if (datas) {
updateSkuCategorySort(e, datas); // 后续接口请求
} else {
// 为空时说明是第一项或最后一项
message.info("已经在最后面");
}
}