#javascript #reactjs #next.js #shopify
#javascript #reactjs #next.js #Shopify
Вопрос:
Я создаю сайт с помощью Next.js и Shopify. Мне нужно создать страницу, на которой будут перечислены все коллекции, соответствующие определенному productType
.
Единственный способ, который я смог найти, чтобы получить эти данные из GraphQL API, — это выполнить поиск по всем продуктам, отфильтрованным productType
и попытаться найти все уникальные коллекции из этого списка.
Вот пример того, как это выглядит.
Как я могу получить только уникальные коллекции? Я пробовал это, к сожалению, это не работает:
const collections = [
...new Set([
...allCollectionsByType.filter(({ node }) => {
const collection = node.collections.edges;
return collection[0]?.node;
}),
]),
];
Извините, если это простой вопрос, я действительно плохо работаю с вложенными массивами!
Ценю любую помощь 🙏
Комментарии:
1. вы должны воспроизвести: создайте (самостоятельно) небольшой json, представляющий allCollectionsByType, примените свои 5 строк и проверьте результат. Если вы все еще не можете прийти к решению, обновите здесь свой минимальный воспроизводимый пример?
Ответ №1:
Мне удалось заставить его работать. Я понял, что Набор не может работать так, чтобы объекты в нем не были уникальными, поэтому мне пришлось сначала упорядочить их.
Я не думаю, что это лучшая реализация (я перебираю массив несколько раз), но она действительно работает.
Вот мое решение, чтобы заставить это работать:
const collections = allCollectionsByType.map(({ node }) => {
const collection = node.collections.edges?.[0]?.node;
return JSON.stringify(collection);
});
const unique = Array.from(new Set(collections))
.filter((node) => typeof node === 'string')
.map((node: string) => JSON.parse(node));