import { useBoolean } from 'ahooks' ; import React , { useEffect , useRef } from 'react' ; import E from 'wangeditor' ; interface IProps { value : string ; onChange : ( value : string ) => void ; } let editor = null ; function App ( props ) { const [ isInitial , setIsInitial ] = useBoolean ( true ) ; const { value , onChange } = props ; const ref = useRef < HTMLDivElement > ( null ) ; useEffect ( ( ) => { editor = new E ( ref . current ) ; editor . config . onchange = ( content ) => { setIsInitial . setFalse ( ) ; onChange ( content ) ; } ; editor . create ( ) ; return ( ) => { editor && editor . destroy ( ) ; } ; } , [ ] ) ; useEffect ( ( ) => { if ( isInitial && value && editor ) { editor . txt . html ( value ) ; } } , [ value , isInitial ] ) ; return ( < div > < div ref = { ref } > < /div> < /div>); } export default App ;