如何在react-quill钩子中添加className="“&自定义标签？

Question

如何使用react-hooks在react-quill中添加自定义className和自定义标记？

从' React‘导入react，{Quill}从’react- ReactQuill‘导入’quill/dist/quill.now.css‘

函数MyEditor() {

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

Answer 1

我换成了slate.js，我发现羽毛笔很难理解