#javascript #vue.js
#язык JavaScript #vue.js
Вопрос:
У меня есть JSON, в котором я хотел бы упорядочить свои данные, чтобы я мог сгруппировать все элементы по названию категории. Вот мои данные.
[ { "id":317, "name":"Ingram's Camphor Cream", "slug":null, "product_category_id":15, "industry_id":2, "deleted_at":null, "category":{ "id":15, "name":"Skincare", "slug":null, "industry_id":2, "deleted_at":null, "sku_id":3, "is_active":1 }, }, { "id":323, "name":"Zimgold", "slug":null, "product_category_id":2, "industry_id":2, "category":{ "id":2, "name":"Cooking Oils", "slug":null, "industry_id":2, "sku_id":2, "is_active":1 } } ]
Я хотел бы получить такой результат:
[ 'Skincare': [ {}], 'Cooking Oils': [{}] ]
Заранее спасибо. Я был бы очень признателен вам за помощь.
Ответ №1:
Вы можете уменьшить массив продуктов до сопоставления имен с массивами продуктов с помощью такого редуктора:
const grouped = products.reduce((grouped, product) =gt; { const key = product.category.name // replace the array at [key] with a new one including the current element return { ...grouped, [key]: (grouped[key]??[]).concat(product)} }, {})
Комментарии:
1. Спасибо, но как мне сделать результат массивом, а не объектом.
2. Я предположил, что квадратные скобки были опечаткой, так как массивы не имеют строковых ключей. Если вы хотите выполнить итерацию по всем группам, вы можете использовать
Object.entries(grouped)
. Это вернет массив[key: string, value: Product[]]
пар.3. Я отправил предложение по редактированию того, что, по моему мнению, было опечаткой в вашем примере с результатом, прежде чем прочитал ваш комментарий. Не могли бы вы внести некоторые незначительные изменения в свой вопрос, чтобы мое предложение было автоматически отклонено?
Ответ №2:
Может быть, есть более красивый способ, но что-то вроде этого сработало бы
var groupedData = {}; data.forEach(item =gt; { if (!groupedData[item.category.name]) { groupedData[item.category.name] = []; } groupedData[item.category.name].push(item); })
Ответ №3:
arr.map(item=gt;{ let key = item.category.name return {[key]:item} })