javascript - 如何检查一个数组是否包含 vue.js 模板中另一个数组中的项目

Question

我正在尝试弄清楚如果 jobs 中的 job.name 也在 anotherArray 中，如何显示 job.name。

    <li v-for='job in jobs'>
    <template v-if="job.name in anotherArray"
      {{ job.name }}
    </template>
    </li>

注意 anotherArray 的结构与 jobs 数组相同。所以我想检查 anotherArray 中的 element.name

我该怎么做？

Answer 1

您可以使用计算来获取anotherArrayName的列表，然后创建一个方法来使用includes进行检查

computed: {
    anotherArrayName() {
        return this.anotherArray.map(item => item.name)
    }
},
methods: {
    isInclude(name) {
        return this.anotherArrayName.includes(name)
    }
}

在模板中

 <li v-for='job in jobs'>
    <template v-if="isInclude(job.name)"
      {{ job.name }}
    </template>
</li>