ReactQuill字数限制方案

最近项目中有用到react-quill富文本，有一个需求是限制2000，但是react-quill本身并没有字数限制，所以我找到了一些解决方案

1. 使用deleteText

quill.on('text-change', function(delta, old, source) {
    if (quill.getLength() > limit) {
        quill.deleteText(limit, quill.getLength());
    }
});

在富文本的onChange事件里通过getLength()获取富文本字数，然后通过deleteText删除多出来的文字。
不过这种方法不是很好，会造成页面的卡顿

2. 监听键盘按下的事件onKeyDown

<ReactQuill
    onKeyDown={this.checkCharacterCount}
    onChange={(value) => this.props.onChange(value)}
/>

checkCharacterCount = (event) => {
    if (this.getCharacterText().length > this.props.maxCharacters && event.key !== 'Backspace') {
        event.preventDefault();
    }
}

监听键盘按下的事件，在监听事件中判断富文本字数是否超出限制的字数，如果超出且键盘按下的不是删除键，就禁止它的默认事件