No response
i'm creating a custom feature where i need to render lexical inside a modal, it works fine but when i try to set defaultValue it doesn't respect it
import RichText from 'payload/dist/admin/components/forms/field-types/RichText';
import { lexicalEditor } from '@payloadcms/richtext-lexical';
// other imports
export const Modal = ({}) => {
// some code
const defaultValue = {
root: {
children: [
{
children: [
{
text: "test",
type: 'text',
},
],
direction: null,
format: '',
indent: 0,
type: 'paragraph',
version: 1,
},
],
direction: null,
format: '',
indent: 0,
type: 'root',
version: 1,
},
};
return (
<Form onSubmit={onSubmit}>
<RichText
name="test"
defaultValue={defaultValue}
label="test"
editor={lexicalEditor({ features: [] })}
type="richText"
admin={{
className: `${BASE_CLASS}__rich-text`,
}}
/>
<Submit>Submit</Submit>
</Form>
)}
2.1.1
No response
The defaultValue
prop in the RichText component actually doesn't do anything. Since that's intended, I'm closing this issue & converted it into a discussion. I've also removed this prop in 4bc5fa7 since it wasn't used.
The defaultValue of the richtext field is populated solely through the Form
. The RichText component itself receives it as value from the useField
hook - which is provided by that Form.
In order to give it a default value, you will have to set the initialState
property of the Form component. Check out the Blocks
Feature if you need an example of how initialState can be created & passed to the Form - I did something similar there
Star
Discord
online
Get dedicated engineering support directly from the Payload team..