indexOf和findIndex，判断后重复推进数据

点击后，获得对象判断是否存在，不存在就将对象推进新的数组，存在删掉。
没有在页面关掉弹窗的时候，可以实现以上操作，但是在页面关掉弹窗再打开，就可以重复推进去。
用indexOf判断id的时候，完全没问题，但是用对象判断的时候，就会重复推进，用findIndex也是
该如何操作？

 v-for="(item,index) in allskin"
              :key="index"
              :icon="item.app_img"
              :text="item.name"
              :class="{color:gather.indexOf(item)>-1}"
              @click="choosepic(item.id,item)"
            />

   // const key = this.gather.findIndex((e) => e === item);

      const key = this.gather.indexOf(item);
      if (key === -1) {
        this.gather.push(item);
      } else {
        this.gather.splice(key, 1);
      }

以下答案引用自GPT-3大模型,请合理使用：

示例？

下面是使用indexOf和findIndex实现判断不重复推进数据的代码示例：

methods: {
    choosepic(id, item) {
      // 使用findIndex查找对象是否存在于gather数组中
      const key = this.gather.findIndex((e) => e === item);

      // 使用indexOf查找id是否存在于gather数组中
      const key = this.gather.indexOf(item);
      if (key === -1) {
        this.gather.push(item);
      } else {
        this.gather.splice(key, 1);
      }
    }
  }

如果我的回答解决了您的问题，请采纳我的回答