如何使用 react-hooks 在 react-quill 中添加自定义类名和自定义标签?
从 'react' 导入 React 导入 ReactQuill,{Quill} 从 'react-quill' 导入 'quill/dist/quill.snow.css'
功能我的编辑器(){
class ShadowBlot {
static create(value) {
let node = super.create();
node.setAttribute('className','Shadow')
return node;
}
}
ShadowBlot.blotName = 'shadow';
ShadowBlot.tagName = 'span';
ShadowBlot.className = 'shadow';
const [value,SetValue] = React.useState('')
const EditorRef = React.useRef()
const formats = ['shadow']
const addShadow = (e) => {
e.preventDefault()
let Editor = EditorRef.current.getEditor()
let range = Editor.getSelection()
range = range ? range : 0
// *******
}
return (
<div>
<h1>Example03</h1>
<button onClick={e => addShadow(e)}>Shadow Class</button>
<ReactQuill
ref={EditorRef}
value={value}
onChange={(e) => SetValue(e)}
formats={formats}
/>
<p>{value}</p>
</div>
)
}
导出默认 MyEditor