Hello All,
I am running into an issue using PrismicRichtext and PrismicText within my Gatsby project. The project is based on the gatsby tutorial from the Prismic website. The tutorial has the user creating a new project using a starter theme https://github.com/prismicio/gatsby-getting-started-tutorial.
The theme is currently using prismic/reactjs and I decided to go ahead and migrate to @prismicio/react while the project is still new. I went through the migration docs and everything seemed pretty straightforward.
While the project builds with no error I cannot seem to render any copy using PrismicText or PrismicRichtext. For instance, I created a Contact component and am using a StaticQuery within. Below is an example of what I have so far. Also, note I am pretty new with Gatsby and hoping someone can help!
import React from 'react';
import { Seo } from '../Seo';
import { StaticQuery, graphql } from 'gatsby'
import { PrismicText } from '@prismicio/react'
const ContactForm = () => {
return (
<StaticQuery
query={ContactFormQuery}
render={data => (
<section>
<Seo title="Contact" description="If you would like to get in contact with us please fill out the contact form." />
<form>
<div>
<label htmlFor="contactName"><PrismicText field={data.prismicContactForm.data.name_copy}/></label>
<input id="contactName" type="text" value="Name" onChange={() => console.log('input changed')}/>
</div>
</form>
</section>
)}
/>
);
}
const ContactFormQuery = graphql`
query ContactForm {
prismicContactForm {
data {
name_copy {
text
}
}
}
}
`;
export default ContactForm;
- Matt