Convert Slate JSON to React JSX
Config:Default (DOM),Default (React)
Change configuration
Default
Edit Slate content
slateToReact
Demo
Try changing the contents of this editor. The rest of the page updates as you make changes to demonstrate:
- the Slate JSON value;
- content rendered using the
<SlateToReact>component.
SlateToReact output
slateToReact
Demo
Try changing the contents of this editor. The rest of the page updates as you make changes to demonstrate:
- the Slate JSON value;
- content rendered using the
<SlateToReact>component.
Slate value
{
type: 'h2',
children: [
{
text: 'slateToReact'
}
]
}
{
type: 'h3',
children: [
{
text: 'Demo'
}
]
}
{
type: 'p',
children: [
{
text: 'Try changing the contents of this editor. The rest of the page updates as you make changes to demonstrate:'
}
]
}
{
type: 'ul',
children: [
{
type: 'li',
children: [
{
text: 'the Slate JSON value;'
}
]
},
{
type: 'li',
children: [
{
text: 'content rendered using the '
},
{
text: '<SlateToReact>',
code: true
},
{
text: ' component.'
}
]
}
]
}