Render Data

[M4TThys123]

• [x] Render a rich text
• [x] Render a image

import {
  PrismicRichText,
  useFirstPrismicDocument,
  PrismicImage,
} from "@prismicio/react";

function App() {
  const [document] = useFirstPrismicDocument();

  return (
    <div>
      {document && <PrismicRichText field={document.data.hompage_heading} />}

      {document && <PrismicImage field={document.data.homepage__header__img} />}
    </div>
  );
}

export default App;

[M4TThys123]

Render the title (key text)

Render homepage__header--img (image)

Render home__text (rich text)

function App() {
  return (
    <div>
      {document && <PrismicRichText field={document.data.test} />}
    </div>
  );

Render home__image (image)

[M4TThys123]

Resultaat