Флажки вывода из вложенного массива

Question

В моих данных есть несколько элементов, каждый из которых имеет вложенный массив категорий, содержащий ID и name .Пример:

    {
    "id": 5,
    "title": "Title Five",
    "notes": "-",
    "category-data": [
        [
            {
                "cat-id": 2,
                "cat-name": "Category Two"
            }
        ]
    ]
},

Как я могу зациклить каждый элемент данных для вывода имени из category-data , избегая дублирования?

Я не уверен, как сделать циклпереверните и выведите вложенные данные категории элементы.

Редактировать: мне пришлось немного изменить структуру данных на:

    {
    "id": 1,
    "title": "Title one",
    "category_data": {
        "1": "Category One Name",
        "2": "Category Two Name"
    }
},

Cheers

Answer 1

После того, как моя структура данных была улучшена, я мог просматривать ее, как и ожидалось.

 <div v-for="(item, index) in info" :key="index" class="form-check">
    <div v-for="(category, 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">{{ category }}</label>
    </div>
 </div>