React---富文本编辑 braft-editor

903 阅读1分钟
import BraftEditor from 'braft-editor'
import 'braft-editor/dist/index.css'

<BraftEditor
    className="material_editor"
    componentBelowControlBar={<TitleInput value={paramsData.title} onChange={(e)=>this.setParamsData('title', e.target.value)} />}
    defaultValue={BraftEditor.createEditorState(paramsData.mainContent)}
    onChange={(v)=>this.setParamsData('mainContent', v.toHTML())}
/>

const TitleInput = ({onChange, value}) => {
    return <input className="TitleInput" type="text" value={value} placeholder="请输入标题" onChange={onChange} />
}

 setParamsData = (n, v) => {
    let {paramsData} = this.state
    paramsData[n] = v
    this.setState({paramsData})
}