Rendering structured text data using GraphQL

Hello guys,

I鈥檝e created a list using structured text and am having trouble accessing the values and displaying them using graphQL.

I鈥檝e using the render package from here: structured-text/packages/to-plain-text at main 路 datocms/structured-text 路 GitHub

I can return the data but it comes through as one big text block (8 separate values bunched together).

I鈥檇 like to create a list item for each text value that gets returned, and I鈥檝e tried mapping over them but then I get a function error.

The attached screenshots should make this a lot easier to visualise and show what I鈥檝e tried.

Any help would be greatly appreciated!


We鈥檝e also resolved this one over email :slight_smile: Going to mark this as solved, but please feel free to follow up via email, okay? Just trying to avoid duplicates.

And for anyone else in a similar situation, the code should be something like this:

import { render } from "datocms-structured-text-to-html-string"; // instead of the plain text version

// const response = [...] // same as before

const json = await response.json();
const allServicesPages =; // All the pages, not just one of them

  { => // each individual page
      {page.serviceHeading}: <Fragment set:html={render(page.serviceList.value)}> // make sure you sanitize this if you have user-generated data!