vue.js 根据标识判断两个数组对象，分别取到相同和不同数据

Vue.js 是一个流行的前端框架，它可以帮助你构建用户界面，并提供响应式的数据绑定功能。当你需要比较两个数组对象并找出相同和不同的元素时，可以利用 JavaScript 的 `filter()` 和 `includes()` 或者一些辅助库如 Vue computed properties 或者 lodash 中的函数。

首先，你可以创建一个计算属性（computed property），比如 `findSameAndDifferent`，来实现这个功能：

<template>
  <div>
    <!-- 其他模板内容 -->
    <p>相同元素: {{ sameElements }}</p>
    <p>不同元素: {{ differentElements }}</p>
  </div>
</template>

<script>
import { mapGetters } from 'vuex';
export default {
  computed: {
    ...mapGetters(['arrayA', 'arrayB']), // 如果在 vuex 中获取数组

    findSameAndDifferent() {
      const sameElements = this.arrayA.filter(obj => this.arrayB.includes(obj.id));
      const differentElementsArrayA = this.arrayA.filter(obj => !this.arrayB.includes(obj.id));
      const differentElementsArrayB = this.arrayB.filter(obj => !this.arrayA.includes(obj.id));

      return {
        sameElements,
        differentElements: {
          arrayA: differentElementsArrayA,
          arrayB: differentElementsArrayB
        }
      };
    }
  }
};
</script>

在这个例子中，我们先通过 `filter()` 函数找出在 `arrayB` 中存在 id 对应项的元素，作为相同元素。然后，分别从每个原始数组中过滤出不在对方中存在的元素，作为不同元素。