javascriptreactjsquillreact-ace

Disable any user input using ReactQuill library

I'm trying to use ReactQuill just to show some rich text that I have, and therefore I don't want that it can receive any input or typing from the user. Reason, I have another library (ReactAce), and ReactQuill is causing a bug that when I type the 'delete' key, it made the ReactAce stops working...

Below you can see the example, that I am trying to disable the Quill instance. 

quillRef = React.createRef();    

componentDidMount = () => {
  console.log(this.quillRef.current.editor);

  this.quillRef.current.editor.enable(false);   // undefined
};

render () { 
    <ReactQuill
      readOnly
      value={info}
      ref={this.quillRef}
      modules={quillConfig}
    >
}

If you know some way to stop the ReactQuill to receive any input from the keyboard, I would be glad because I think that is causing the bug.

Thank you!

Solution

  • in React Quill 1.3.5, you can add the readOnly prop as true. It will disable your editor like input tag when disabled.