TypeError: не удается прочитать свойство 'Fluid' со значением NULL.

Я пытаюсь получить изображения из содержательных данных на сайте gatsby. Я могу получить текстовое содержимое.

Я просмотрел gatsby-image документацию по плагину. выглядит нормально.

const getBlogList = graphql`
{
  blogs: allContentfulBlog {
    edges {
      node {
        id
        title
        image {
          fluid(maxWidth:250) {
            ...GatsbyContentfulFluid_tracedSVG
          }        
        }
      }
    }
  }
}
`;

<StaticQuery 
      query={getBlogList} 
      render={ data => {
      return({data.blogs.edges.map(({node})=>{
      return(<div><Img fluid={node.image.fluid} /></div>)
          }) 
        }
       )
      }} />

Я не мог найти, где я ошибся. Я получил ошибку

TypeError: невозможно прочитать свойство "Fluid" со значением NULL.


person Rdb    schedule 06.06.2019    source источник
comment
ознакомьтесь с этой проблемой - github.com/gatsbyjs/gatsby/issues/9423   -  person BSeitkazin    schedule 06.06.2019
comment
У меня была такая же проблема, потому что исходное имя файла загруженного изображения содержало точку и вопросительный знак. Загрузка файла с приличным именем в Contentful сделала свое дело.   -  person nevermind777    schedule 22.01.2021


Ответы (3)


Когда вы получаете свойство чтения с нулевой ошибкой, это означает, что родительское свойство имеет значение NULL. Возможно, у какого-то узла нет свойства изображения, поэтому, когда вы пытаетесь прочитать текучую среду с нулевым значением, вы получаете ошибку. Попробуйте проверить наличие изображения в узле функции карты, прежде чем использовать его для достижения свойства жидкости.

person Mehdi Emrani    schedule 06.06.2019

Вы можете попробовать это внутри JSX, чтобы проверить наличие значения:

{node.image && (         //Check with console.log what value node.image?
   <div><Img fluid={node.image.fluid} />  //renders if value present
)}
person Patrik Rikama-Hinnenberg    schedule 06.02.2020

Мехди прав. У меня была такая же проблема, но когда я понял, что забыл поместить изображения из панели управления Contentful и установить все изображения оттуда, проблема была решена. Ошибка пытается сообщить вам, что вы еще не установили все изображения из панели управления Contentful. Вот почему свойство parent имеет значение null.

person Arisa    schedule 02.07.2019