<template>
<div>
<button @click="moveUp(array, index)" :disabled="index === 0">上移</button>
<button @click="moveDown(array, index)" :disabled="index === array.length - 1">下移</button>
<ul>
<li v-for="(item, index) in array" :key="index">{{ item }}</li>
</ul>
</div>
</template>
<script>
export default {
data() {
return {
array: ['Item1', 'Item2', 'Item3', 'Item4'],
index: 1, // 假设当前选中的元素索引为1
};
},
methods: {
moveUp(arr, index) {
if (index === 0) return;
arr.splice(index - 1, 0, arr.splice(index, 1)[0]);
},
moveDown(arr, index) {
if (index === arr.length - 1) return;
arr.splice(index + 1, 0, arr.splice(index, 1)[0]);
}
}
};
</script>
vue操作数组中数据上移或者下移位置
最新推荐文章于 2024-08-30 20:29:15 发布