Удалить дубликаты из цикла For

Question

Как я могу удалить дубликаты из моего цикла for?

Я предполагаю, что с помощью вычисляемой функции или есть что-то, что я могу просто добавить в цикл ниже, чтобы выводить дубликаты только из моих данных.

 <div v-for="(item, index) in info" :key="index" class="form-check">
    <div v-for="(cat, index) in item.category_data" :key="index">
        <input type="checkbox" class="form-check-input" v-model="cat_data" :id="index" :value="index">
        <label class="form-check-label">{{ cat }}</label>
    </div>
</div>

Код Ручка с дубликатами : https://codepen.io/anon/pen/XxNORW?editors=1010

Спасибо

Answer 1

Я думаю, вы пытаетесь сделать слишком много в своей разметке.Сохраняйте минимальную обработку данных в разметке.

Поэтому я бы посоветовал использовать фильтр для возврата массива с удаленными дубликатами.

Разметка

 <div v-for="(filteredArray(arr), index) in info" :key="index" class="form-check">
   ...
</div>

Сценарий

Добавьте отфильтрованное свойство в ваш экземпляр vue.js.

filters: {
  filteredArray: function (array) {
    let data = {}
    this.info.forEach(i=>{
      Object.assign(data,i.category_data)
     })
    return data;
  }
}

Answer 2

Я думаю, что есть много способов добиться "Удалить дубликаты из цикла"

, просто приведите пример:

remove_category_duplicates: function () {
    // Get all categories and remove duplicates
    let data = {}
    this.info.forEach(i=>{
        Object.assign(data,i.category_data)
    })
    return data;
 }

codepen