2

We are working in JSS integrated mode, in one of the page we need to retrieve the child items from a folder and render them. As we are implementing the site in integrated mode, we expect the features like in-context editing enabled for this particular page. Looks like graphQL can be an option to retrieve the folder items other than datasource item and context item, but how do we enable the in-context editing when rendering the page using graphQL data?

4

In context editing will work only in integrated mode. Write your graphQL something like the below, [retrieve the jss property of the field instead of value]

query RetrieveContentBlocks($itemPath: String = "/sitecore/content/poc-app/Item1") {

      pageItem: item(path: $itemPath)
  {
    children
    {
      name
      contentValue: field(name:"content")
      {
        jss
      }
    }
  }
}

Render the content like below, [render the jss property of the field]

return(
    <div>
      <h2><p>Content Retrieved using GraphQL</p></h2>
      {pageItem && (
          <div>
            <b>children items..!</b>
            <br/>
            <ul>
              {pageItem.children.map((child) => (
                <li key={child.name}>
                  <RichText field={child.contentValue.jss}/>
                </li>
              ))}
            </ul>
          </div>
        )}
    </div>
  );
};
  • 1
    Thank you Gobinath. I was able to get it work with the suggested solution. – Raghu Mar 26 at 17:51

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.