How to display rendered html on remirror renderer?

Question

I would like to display the results from the editor below..

I am currently trying

const { manager, state, setState } = useRemirror({
    extensions: () => [
      new BoldExtension(),
      new ItalicExtension(),
      new UnderlineExtension(),
      new BulletListExtension(),
      new OrderedListExtension(),
      new TextColorExtension(),
      new TextHighlightExtension(),
      new HeadingExtension(),
      new HardBreakExtension()
    ],
    content: content,
    selection: 'start',
    stringHandler: 'html',
  });
<Remirror manager={manager} initialContent={state} state={state} onChange={(param) => setState(param.state)}>
  <EditorComponent />
  <Menu />
</Remirror>
<RemirrorRenderer json={state} />

This renders my editor properly, but not the result of it below (note that I don't want to print the html code, I would like to get the json and display the rendered html)

Could anyone help me? Thanks

Answer 1

You can use a read-only renderer like this and pass the html string through the html prop.