Блог

Вот такой сценарий.. Я запрашиваю базу данных и заполняю массив, полный объектов. В данном случае объектами являются предметы. Я создаю фильтр на основе категорий. Цель состоит в том, чтобы запустить массив объектов через фильтр, который проверяет соответствие категории. Строка 45-48 пытается создать этот фильтр. Я объявляю переменную, устанавливаю ее равной результату, возвращаемому методом фильтра. Однако при выполнении метода includes я получаю сообщение об ошибке «Не удается прочитать свойство includes неопределенного». Ясно, как мы видим в консоли, мой массив объектов печатается из строки непосредственно перед фильтром, и объект явно содержит поле категорий, содержащее массив. Какого черта я не понимаю? Данные подтверждения выходят из консоли.войдите в код

 function RenderFilteredList(props) {
console.log(props.allPosts);
let filteredPosts = props.allPosts.filter((post, index) =>
  post.categories.includes(props.category)
);

return (
  <div className="posts-grid">
    {filteredPosts amp;amp;
      filteredPosts.map((post, index) => (
        <div className="grid-post-card" key={post.slug.current}>
          <Link to={"/"   post.slug.current}>
            <img
              className="grid-image"
              src={urlFor(post.featuredImage).width().url()}
              alt=""
            />
            <p className="grid-post-title">{post.title}</p>
            <p className="grid-post-author">
              {post.name   " - "   post.date}
            </p>
          </Link>
        </div>
      ))}
  </div>
);
 

}

На вашем скриншоте консоли categories для четвертого элемента не отображается allPosts .

Поскольку ошибка может возникнуть , если какой-либо элемент allPosts отсутствует categories , вы подтвердили, присутствует ли он во всех элементах?

Возможно, вам потребуется изменить свою filter функцию, чтобы проверить наличие categories поля и исключить элементы, в которых его нет.

у вас есть опечатка, вы регистрируетесь allPosts , но получаете доступ к реквизитам.allPosts

 let filteredPosts = allPosts.filter((post, index) =>
  post.categories.includes(props.category)
);

 

Похоже, что четвертый элемент в реквизите.allPosts может не содержать массива категорий. Можете ли вы проверить, что каждое сообщение в allPosts содержит массив категорий?