How to use the ProseMirror

I use the Basic demo to create richEditor in react, and the web shows the right inputArea, and I GET the data from the input by

    import React, { useEffect,useState } from 'react';
    import { EditorState } from 'prosemirror-state';
    import { EditorView } from 'prosemirror-view';
    import { Schema, DOMParser } from 'prosemirror-model';
    import { schema } from 'prosemirror-schema-basic';
    import { addListNodes } from 'prosemirror-schema-list';
    import { exampleSetup } from 'prosemirror-example-setup';



/** Save the value that will send to the server, when I click the submit btn**/

and I will get the data when I first render in Effect or the componentDidmount

  useEffect(() => {
    const mySchema = new Schema({
      nodes: addListNodes(schema.spec.nodes, 'paragraph', 'block'),
      marks: schema.spec.marks,
    window.view = new EditorView(document.querySelector('#editor'), {
      state: EditorState.create({
        doc: mySchema.nodeFromJSON(JSON.parse(localStorage.getItem('state'))),
        plugins: exampleSetup({ schema: mySchema }),