0

Есть массив и 5 объектов:

var arr = ['яблоко','апельсин']

[
  {
    name: 'Вася',
    tags: ['яблоко','апельсин', 'малина', 'банан'],
    show: true
  },
  {
    name: 'Петя',
    tags: ['вишня','апельсин', 'розы', 'слива'],
    show: true
  },
  {
    name: 'Дима',
    tags: ['яблоко','слива', 'елка', 'банан'],
    show: true
  },
  {
    name: 'Валера',
    tags: ['персик','крыжовник', 'груша', 'черешня'],
    show: true
  },
  {
    name: 'Победаносный',
    tags: ['крыжовник','персик', 'малина', 'банан'],
    show: true
  }
]

Как перебрать эти 5 объектов на совпадение элементов другого массива и без изменений массива в каждом объекте, ключу show присвоить значение false или true если все элементы массива есть в массиве объекта?

1 ответ 1

1

let arr = ['яблоко', 'апельсин']
new Vue({
  el: '#root',
  data: {
    els: [{
        name: 'Вася',
        tags: ['яблоко', 'апельсин', 'малина', 'банан'],
        show: true
      },
      {
        name: 'Петя',
        tags: ['вишня', 'апельсин', 'розы', 'слива'],
        show: true
      },
      {
        name: 'Дима',
        tags: ['яблоко', 'слива', 'елка', 'банан'],
        show: true
      },
      {
        name: 'Валера',
        tags: ['персик', 'крыжовник', 'груша', 'черешня', 'яблоко', 'апельсин'],
        show: true
      },
      {
        name: 'Победаносный',
        tags: ['крыжовник', 'персик', 'малина', 'банан'],
        show: true
      }
    ]
  },
  methods: {
    filterIt: function () {
      // Получаем разницу элемента и эталона; если вычлись все эталонные элементы - изменяем статус
      this.els.forEach(el => el.tags.length - el.tags.filter(i => arr.indexOf(i) < 0).length === arr.length ? el.show = false : null);
    }
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.min.js"></script>
<div id='root'>
  <ul>
    <li v-for="(el, i) in els" :key="i" :style="{color: !el.show ? '#000' : '#ccc' }">Name: <strong>{{ el.name }}</strong>, tags: <strong>{{ el.tags.join(', ') }}</strong></li>
  </ul>
  <input type='button' value='Filter it' @click="filterIt" />
</div>

6
  • Здорово, спасибо за ответ! Как сделать чтобы отображались и те, у кого есть по отдельности яблоко или апельсин 7 июн 2018 в 13:02
  • Да выводить по тому же флагу. Спасибо тут выражают в плюсах. И, если ответ решил Вашу задачу, примите его (галочка слева от ответа).
    – user207618
    7 июн 2018 в 13:04
  • Что то не въезжаю, как сделать сравнение не по полному совпадению, а частичному? 7 июн 2018 в 13:24
  • Т. е.?......................
    – user207618
    7 июн 2018 в 13:25
  • Вот есть у меня пустой массив, я кликом добавил в него яблоко, осуществилась проверка и если есть совпадения, то присвоился ключ true Еще один клик и добавился апельсин, снова прошла проверка и если есть совпадения хотя бы по одному тегу, то show: true 7 июн 2018 в 13:29

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.