search

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

RichText with React Native #43

Closed mespeche closed 4 years ago

mespeche commented 4 years ago

Hi !

I have an issue when i use RichText on my React Native application.

With React Native, any text should be in a component.

Rich text return me an error if I do : <RichText render={...} Component="Text"/>

Same things if I do : <RichText render={...} Component={<Text />} />

Have you got an idea ?

Many thanks ;)

codetopixels commented 2 years ago

Did anyone ever find a solution to this please?

angeloashmore commented 2 years ago

@codetopixels You should be able to use this component with React Native (I have not tested it myself, however). You will need to provide a custom serializer since the default serializer will return HTML components.

You can see an example here: https://prismic.io/docs/technologies/html-serializer-reactjs#example-with-all-elements

For each block type (heading1, paragraph, etc.), return a React Native component like <View> or <Text>.

If you are okay using a beta version of this library, I highly recommend it. The v6 beta version of @prismicio/react lets you define these components using a simpler syntax.

You can see an example here: https://prismic.io/docs/technical-reference/prismicio-react#prismicrichtext

codetopixels commented 2 years ago

That's great, thank you!