Simplify your stack and build anything. Or everything.
Build tomorrow’s web with a modern solution you truly own.
Code-based nature means you can build on top of it to power anything.
It’s time to take back your content infrastructure.

HTML to Lexical

default discord avatar
hai_q_28last year
6

Are there any examples to convert a html string to lexical to save it in the db?


Finding hard to understand the documentation.

  • discord user avatar
    alessiogr
    last year

    Hey, what exactly is unclear in the documentation? Maybe I can improve it

  • default discord avatar
    hai_q_28last year

    export function HtmlToLexical({ htmlString }: HtmlProps) {


    const parser = new DOMParser();


    const dom = parser.parseFromString(htmlString, textHtmlMimeType);



    // Once you have the DOM instance it's easy to generate LexicalNodes.


    const nodes = $generateNodesFromDOM(editor, dom);



    // Select the root


    $getRoot().select();



    // Insert them at a selection.


    $insertNodes(nodes);}




    i want to create a function to convert my html String to the lexical format so i want to return the text in lexical json format so i can save the text in my db



    how do you use the method above though?

  • discord user avatar
    alessiogr
    last year

    Here's a better example:

    https://payloadcms.com/docs/rich-text/lexical#html-lexical

    All the functions prefixed with $ have to be wrapped inside of an

    editor.update()

    call back - otherwise they won't work

  • default discord avatar
    hai_q_28last year

    what do i have to fill the const yourEditorConfig; // <= your editor config here with?



    and how do i return the json after the convertion

  • discord user avatar
    alessiogr
    last year
    what do i have to fill the const yourEditorConfig; // <= your editor config here with?

    You can use



    sanitizeEditorConfig(defaultEditorConfig)

    to get the default editor config and just use that one.



    and how do i return the json after the convertion
    const editorJSON = headlessEditor.getEditorState().toJSON()
  • default discord avatar
    hai_q_28last year

    thank you!

Star on GitHub

Star

Chat on Discord

Discord

online

Can't find what you're looking for?

Get dedicated engineering support directly from the Payload team..