|
@@ -1,5 +1,4 @@
|
|
|
import { Spin } from 'antd'
|
|
import { Spin } from 'antd'
|
|
|
-import classNames from 'classnames'
|
|
|
|
|
import React, { useState, useEffect, useRef } from 'react'
|
|
import React, { useState, useEffect, useRef } from 'react'
|
|
|
import Vditor from 'vditor'
|
|
import Vditor from 'vditor'
|
|
|
import 'vditor/src/assets/scss/index.scss'
|
|
import 'vditor/src/assets/scss/index.scss'
|
|
@@ -7,8 +6,7 @@ import 'vditor/src/assets/scss/index.scss'
|
|
|
const RighEditor = ({ value, onChange }) => {
|
|
const RighEditor = ({ value, onChange }) => {
|
|
|
const ref = useRef()
|
|
const ref = useRef()
|
|
|
const [state, setState] = useState({
|
|
const [state, setState] = useState({
|
|
|
- initValue: value,
|
|
|
|
|
- loading: true
|
|
|
|
|
|
|
+ initValue: value
|
|
|
})
|
|
})
|
|
|
|
|
|
|
|
function handleEditorChange(content) {
|
|
function handleEditorChange(content) {
|
|
@@ -54,17 +52,7 @@ const RighEditor = ({ value, onChange }) => {
|
|
|
'edit-mode',
|
|
'edit-mode',
|
|
|
{
|
|
{
|
|
|
name: 'more',
|
|
name: 'more',
|
|
|
- toolbar: [
|
|
|
|
|
- 'both',
|
|
|
|
|
- 'code-theme',
|
|
|
|
|
- 'content-theme',
|
|
|
|
|
- 'export',
|
|
|
|
|
- 'outline',
|
|
|
|
|
- 'preview',
|
|
|
|
|
- 'devtools',
|
|
|
|
|
- 'info',
|
|
|
|
|
- 'help'
|
|
|
|
|
- ]
|
|
|
|
|
|
|
+ toolbar: ['both', 'code-theme', 'content-theme', 'export', 'outline', 'preview', 'devtools', 'info', 'help']
|
|
|
}
|
|
}
|
|
|
],
|
|
],
|
|
|
value: state.initValue,
|
|
value: state.initValue,
|
|
@@ -74,21 +62,12 @@ const RighEditor = ({ value, onChange }) => {
|
|
|
cache: {
|
|
cache: {
|
|
|
enable: false
|
|
enable: false
|
|
|
},
|
|
},
|
|
|
- placeholder: '请键入内容',
|
|
|
|
|
- after() {
|
|
|
|
|
- setState({ ...state, loading: false })
|
|
|
|
|
- }
|
|
|
|
|
|
|
+ placeholder: '请键入内容'
|
|
|
})
|
|
})
|
|
|
}, [])
|
|
}, [])
|
|
|
- const className = classNames(
|
|
|
|
|
- 'h-200px rounded-2px leading-200px',
|
|
|
|
|
- state.loading ? 'border border-hex-d9d9d9' : null
|
|
|
|
|
- )
|
|
|
|
|
return (
|
|
return (
|
|
|
- <div className={className}>
|
|
|
|
|
- <Spin spinning={state.loading}>
|
|
|
|
|
- <div ref={ref} />
|
|
|
|
|
- </Spin>
|
|
|
|
|
|
|
+ <div className="h-200px rounded-2px leading-200px border border-hex-d9d9d9">
|
|
|
|
|
+ <div ref={ref} />
|
|
|
</div>
|
|
</div>
|
|
|
)
|
|
)
|
|
|
}
|
|
}
|