Как отфильтровать статьи по категориям, чтобы узнать точное количество страниц для пагинации (JS)
На моих веб-сайтах Gatsby JS я распределил статьи по категориям, и мне удалось создать страницу для каждой категории и разбить каждую страницу на страницы на основе максимального количества статей, которые должны отображаться на странице. Проблема в том, что вместо того, чтобы рассчитывать точное количество существующих страниц по категории, мой код вычисляет общее количество существующих страниц (на основе всех статей, а не статей по категориям).
Это код:
gatsby-node.js
let categories = []
_.each(result.data.allMarkdownRemark.edges, edge => {
if (_.get(edge, "node.frontmatter.categories")) {
categories = categories.concat(edge.node.frontmatter.categories)
}
})
const categoryarticles = categories.filter(category =>{
return category === category
})
const categoryarticlesPerPage = 6
const numPages = Math.ceil(categoryarticles.length / categoryarticlesPerPage)
//Creating a PAGINATED page for each category, so that any category page will only display a certain amount of articles (defined in categoryarticlesPerPage)
Array.from({ length: numPages }).forEach((el, i) => {
categories.forEach(category => {
createPage({
path: i === 0 ? `/${_.kebabCase(category)}` : `/${_.kebabCase(category)}/${i + 1}`,
component: categoryTemplate,
context: {
category,
limit: categoryarticlesPerPage,
skip: i * categoryarticlesPerPage,
numPages,
currentPage: i + 1,
},
})
})
})
Ошибка, несомненно, в статье категории const.
Желаемый результат - вычислить количество статей по категориям, чтобы разбивка по категориям начала работать должным образом (прямо сейчас создается больше страниц, чем необходимо, поскольку учитывается все количество статей, представленных на веб-сайте).
Есть подсказка?
Спасибо.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
const categoryarticles = categories.filter(category =>{
return category === category
})
всегда возвращает весь массив, поскольку category === category всегда является true. Одна из этих переменных category должна быть другой. Наверное, нужно фильтровать по articles.
Кроме того, это похоже на идеальную работу для _.flatMap, например:
const categories = _.flatMap(result.data.allMarkdownRemark.edges, edge => {
return _.get(edge, "node.frontmatter.categories", []);
});
// get articles from somewhere
const categoryarticles = articles.filter(category => {
return article.category === category;
});
Если вы хотите подсчитать количество статей в каждой категории, вы можете использовать _.countBy следующим образом:
const categoryWiseArticleCount = _.countBy(articles, article => {
// return the article category here
return article.category;
});
console.info(categoryWiseArticleCount);
// {
// category_1: 7,
// category_2: 10,
// }
Переменная article - здесь не определена. Откуда ты это взял? Раньше я не пользовался Gatsby и поэтому точно не знаю, как получить article.
Я знаю только, как определять статьи, но понятия не имею, как определять отдельную статью. Есть ли другой способ добиться результата?
Если мне так нравится: const categoryarticles = result.data.allMarkdownRemark.edges.filter(edge => edge.node.frontmatter.categories === 'management') вроде работает. Он берет все статьи категории «менеджмент» и по этому номеру начинает работать пагинация. Как я могу использовать переменную категории вместо жестко запрограммированной, чтобы она настраивалась для каждой категории массива категорий?
Я обновил ответ, чтобы сделать это. Взгляни, пожалуйста.
Хорошо, давай начнем чат, пожалуйста.
Позвольте нам продолжить обсуждение в чате.
Привет, спасибо за помощь! Итак, я пробовал следующее: const article = result.data.allMarkdownRemark.edges const categoryarticles = article.filter (category => {return article.categories === category}), и в нем говорится, что статья не определена. (Обратите внимание, что в return article.categories категории во множественном числе не являются ошибкой, это атрибут в файлах уценки). Что мне не хватает?