第一步:安装
npm i react-quill
第二步:引入
import ReactQuill from 'react-quill'
import 'quill/dist/quill.snow.css'
第三步:定义react-quill的配置对象,我只做了简单配置,详细配置可以去照着文档配
const quillOption = {
toolbar: {
container: [
[{ header: [1, 2, 3, 4, 5, 6, false] }],
['bold', 'italic', 'underline', 'strike'],
[{ list: 'ordered' }, { list: 'bullet' }],
[{ align: [] }],
[{ color: [] }, { background: [] }],
['link', 'image'],
['clean']
]
}
}
第四步:结构,还有value属性和onChange方法
<ReactQuill
theme='snow'
value={value}
onChange={handleChange}
modules={quillOption}
className='ql-editor'
/>