prismicio / prismic-react

React components and hooks to fetch and present Prismic content
https://prismic.io/docs/technologies/homepage-reactjs
Apache License 2.0
154 stars 40 forks source link

Cannot read property 'map' of undefined #49

Closed alexanderfountain closed 4 years ago

alexanderfountain commented 4 years ago

I'm sourcing prismic via gatsby-source-prismic

I'mm trying to render like this: {items.map((item, index) => (

  <RichText render={item.content} />

))}

Seems to be from line 588 from prismic-reactjs.js "var t = e.spans.map(function (t) {"

I have rich text in a repeatable slice.

Any thoughts would be much appreciated.

hypervillain commented 4 years ago

Hey @alexanderfountain ,

sorry you encountered an issue. Can you log item.content and paste the result here? It usually means that prismic-richtext is passed an empty value, or something that looks like rich text but is not

Razinsky commented 4 years ago

I have the same exact problem. In GraphQL my Rich text content type gives

{
  html: String
  text: String
  raw: [{
    type: String
    text: String
  }]
}

If I try to render it with

<RichText render={item.content} />

I get a simple warning Rich text argument should be an Array.

But if I try to render with

<RichText render={item.content.raw} />

then I get

image

Any help would be greatly appreciated.

alexanderfountain commented 4 years ago

I was unable to resolve this Razinsky.

My solution was to switch my gatsby-source-prismic from version 2 to version 3.

If you go that route you need to create schema json files containing your content types. You can copy and paste these directly from prismic.

hypervillain commented 4 years ago

This might be related to plugin you use, then. Have you looked at https://github.com/birkir/gatsby-source-prismic-graphql instead?

On Tue, Feb 25, 2020 at 3:43 PM Alexander Fountain notifications@github.com wrote:

I was unable to resolve this Razinsky.

My solution was to switch my gatsby-source-prismic from version 2 to version 3.

If you go that route you need to create schema json files containing your content types. You can copy and paste these directly from prismic.

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/prismicio/prismic-reactjs/issues/49?email_source=notifications&email_token=ABSDRAIOEH5BNOMFAKYTHH3REUU7PA5CNFSM4KRWVJZ2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEM4G2LQ#issuecomment-590900526, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABSDRAOKO2F7CXS2LW63ZXDREUU7PANCNFSM4KRWVJZQ .

alexanderfountain commented 4 years ago

Yes I did. That worked with your richtext, but gatsby-source-prismic-graphql forces you to create pages an odd way via a constrained method in your gatsby-config file instead of the standard more flexible method in your gatsby-node file which I needed. At any rate I think we can close this as upgrading to version 3 of gatsby-source-prismic fixes the problem.

Razinsky commented 4 years ago

Yeah @hypervillain that works but I agree with @alexanderfountain, gatsby-source-prismic version 3 works fine. Thanks @alexanderfountain

Jezfx commented 4 years ago

Yeah thanks @alexanderfountain — upgrading to v3 was the only way I've been able to get it to work too.