Open linzhengen opened 4 years ago
https://blog.csdn.net/weixin_42618492/article/details/102844342
handleUp(item, index) { // item为选中的项 index为对应的index let self = this; item = self.item; //选中值 if (item.length == 1) { // 因为右侧的选项是可以多选，但这里的上下移动事件，我做的是单项上移，每次上移一个空间，所 以判断，当我的选中值只有一个选项时，进行上移操作 //选中值的下标 【这里我不知道如何直接获取选中值的下标，所以用find()方法，在右侧值的数组里chooseRole中找选中项 对应的下标】 self.chooseRole.find((val, indexs, arr) => { // find()方法 val-项，indexs-下标，arr数组 if (val == item) { // chooseRole数组的项val等于我选中的项item index = indexs; // 数组项的下标就是我当前选中项的下标 } }); if (index == 0) { //当选择的项的下标为0，即第一个，则提醒没有上移的空间，选择其他项进行上移 self.$message("没有上移的空间了"); return; } // 上移-改变的数组（项和下标同时改变） let changeItem = JSON.parse(JSON.stringify(self.chooseRole[index - 1])); self.chooseRole.splice(index - 1, 1); self.chooseRole.splice(index, 0, changeItem); } else { self.$message.error("只能选择一条数据进行上下移动"); return; } }
//下移事件 handleDown(item, index) { let self = this; item = self.item; if (item.length == 1) { //选中值的下标 self.chooseRole.find((val, indexs, arr) => { if (val == item) { index = indexs; } }); if (index == self.chooseRole.length-1) { // 这里是length-1,因为下标值从0开始 self.$message("没有下移的空间了"); return; } let changeItem = JSON.parse(JSON.stringify(self.chooseRole[index])); self.chooseRole.splice(index,1); self.chooseRole.splice(index + 1, 0, changeItem); } else { self.$message.error("只能选择一条数据进行上下移动"); return; } } }
参考URL
https://blog.csdn.net/weixin_42618492/article/details/102844342