Question

如何从数组中删除一个值（如果存在）或将其推送到数组（如果不存在）？

HTML：

...
<button @click="addToOpenedMenuPosition(item.id)"
...

Vue.js：

data: function() { return {
    openedMenuPositionIds: [],
    ...
}

Answer 1

通过删除item.id创建一个新数组，但是如果item.id没有退出，则不会删除任何内容，我们可以安全地添加item.id，否则我们将返回修改后的移除了item.id的数组。

const newMenuPositionIds = menuPositionIds.filter(({id}) => id !== item.id);
if(newMenuPositionIds.length === menuPositionIds.length) {
    newMenuPositionIds.push(item.id);
}
return newMenuPositionIds;

Answer 2

假定您要从仅包含ID作为整数的item.id数组中删除openedMenuPositionIds，则可以简单地使用数组.indexOf()，.push()和{{3} }实现此目的的方法，例如：

var example2 = new Vue({
  el: '#example-2',
  data: function() {
    return {
      openedMenuPositionIds: [],
    }
  },
  // define methods under the `methods` object
  methods: {
  
    addToOpenedMenuPosition(id) {

      // Get the index of id in the array
      const index = this.openedMenuPositionIds.indexOf(id);
      if (index > -1) {
        // This means id is present in the array, so remove it
        this.openedMenuPositionIds.splice(index, 1);
      } else {
        // This means id is not present in the array, so add it
        this.openedMenuPositionIds.push(id);
      }
      
      // You can use this to debug purpose
      console.log( this.openedMenuPositionIds )
    }
  }
})

Answer 3

使用js的简单实现

const arr = ["one","two","three"]; //example array
const newId="one";                 //new id 

if(!arr.includes(newId)){          //checking weather array contain the id
    arr.push(newId);               //adding to array because value doesnt exists
}else{
    arr.splice(arr.indexOf(newId), 1);  //deleting
}
console.log(arr);

Answer 4

我认为元素是唯一的，

非常简单。您可以使用.includes()来检查其是否在数组中，并使用.indexOf查找ID的索引。然后您用已建立索引的元素.splice()，否则只需将其推入数组。

您需要在那里的return“停止”该功能以继续：

addToOpenedMenuPosition(id){
   let arr = this.openedMenuPositionIds;
   if(arr.includes(id)){
      arr.splice(arr.indexOf(id), 1);
      return;
   }
   arr.push(id);
}

如何从数组中删除一个值（如果存在）或如何将其推送到数组（如果不存在）？

4 个答案: