VueJS：检查属性是否具有来自另一个属性的值答案

【问题标题】：VueJS: Check if property has value from another propertyVueJS：检查属性是否具有来自另一个属性的值
【发布时间】：2016-04-15 17:34:30
【问题描述】：

我目前正在学习 Javascript (VueJS) 并更新了我现有的 Laravel 应用程序之一。到目前为止效果很好。我仍然有一个问题：我有两个道具（例如prop1和prop2）并且想要以不同的方式呈现表格中的条目，如果prop1中的值也存在于prop2中，这意味着该值在prop2中的某个地方。看这个示例代码：

<tr v-for="s in list">
    <td v-if="s.value1 is also present in prop2"><i class="fa fa-circle text-danger"></i></td>
    <td v-else><i class="fa fa-circle text-success"></i></td>
    <td>{{ s.value1 }}</td>
    <td>{{ s.value2 }}</td>
</tr>

有没有一种简短的“类似 vue”的方式来做到这一点？

【问题讨论】：

标签： javascript arrays vue.js

【解决方案1】：

您可以使用 .some 运算符来检查一个值是否存在于另一个数组中：

// Will return true if any items matches s.value1
prop2.some(function (item) {
    return item === s.value1
});

您可以将其作为方法或计算属性添加到您的 Vue 实例中，例如：

var app = new Vue({
    el: "#vue",
    data: {
      prop2: []
    },
    methods: {
      checkProp2: function(val) {
        return prop2.some(function (item) {
          return item === val;
        })
      }
    }
})

然后你可以这样做：

<tr v-for="s in list">
    <td v-if="checkProp2(s.value1)"><i class="fa fa-circle text-danger"></i></td>
    <td v-else><i class="fa fa-circle text-success"></i></td>
    <td>{{ s.value1 }}</td>
    <td>{{ s.value2 }}</td>
</tr>

【讨论】：

谢谢。效果很好:)

【解决方案2】：

<td v-if="s.value1 === s.value2">

【讨论】：

它说“也存在”，所以我猜相等的比较是不够的
那么 OP 应该解释一下“也存在”应该是什么意思。