import React, { Component, useState,useEffect } from 'react';
import { CKEditor } from '@ckeditor/ckeditor5-react';
import ClassicEditor from '@ckeditor/ckeditor5-build-classic';
import axios from 'axios';
import parse from 'html-react-parser';
import load from './fun_load';

function App () {
const [Data,setData]=useState('');
const handleChange=(event,editor)=>{
 setData(editor.getData());
}
  const handleClick=async()=>{
    console.log(Data);
    let res=await axios.post("/send",Data);
    console.log(res);
   
  }
  useEffect(() => {
    // load();
  },)
  
            return (
            <div className="Ap">
                <h2>Using CKEditor 5 build in React</h2>
                <CKEditor
                    editor={ ClassicEditor }
                    onChange={ ( event, editor ) => {
                     handleChange(event,editor)
                  } }
                />
                
                <button type='submit' onClick={handleClick}>Submit</button>
                {
                Data===""?
                <div>Fun</div>:
                <div style={{ marginLeft:'0px' }}>{parse(Data)}</div>
                }
                
            </div>
        );
    }


export default App;

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>