Как проверить на равенство с элементом массива в Vuejs v-if?

Question

Я работаю в проекте vuejs, и у меня возникла проблема с проверкой, равно ли число элементу Array. Мой код такой:

<div v-if="someValue != arrayElement">
   //
</div>

Моя проблема заключается в том, как il oop через массив проверить, есть ли значение, равное var 'someValue'.

Answer 1

Вы можете использовать Array.includes(value), если хотите проверить точное значение

new Vue({
    data: function() {
        return {
            value: 3,
            array: [3,4,5,6,7,3]
        }
    },
    computed: {
        isInArray: function() {
            return this.array.includes(value);
        }
    }
})

Или непосредственно в директиве v-if, подобной этой

<span v-if="array.includes(value)"> {{ value }} </span>

Answer 2

Лучший способ - создать вычисляемое свойство, которое фильтрует ваш массив по заданному значению c. Например:

new Vue({
  data: function() {
    someValue: 3,
    array: [3,4,5,6,7,3]
  },
  computed: {
    arrayFiltered() {
      return this.array.filter(elem => elem === this.someValue);
    }
})

и в вашем html это может выглядеть так:

<div v-if="array.includes(someValue)">
   <div v-for="elem in arrayFiltered" :key="array.indexOf(elem)">
     {{ elem }}
   </div>
 </div>

Таким образом, вы можете указать свой массив, например, как массив объектов.