React-quill: onBlur not working

[jaimefps]

I have a TextEditor component that locally stores the content of ReactQuill, and I only want to send the content value to Redux 'onBlur'. The Blur event seems to work fine EXCEPT when clicking buttons on the screen screen. (E.g., when I write something in a ReactQuill component and then click a "save" button).

Current Code:

class TextEditor extends React.Component {
    constructor(props) {
        super(props)
        this.state={
            content: this.props.content;
        }
        this.handleQuillEditor_change = this.handleQuillEditor_change.bind(this)
        this.handleQuillEditor_update = this.handleQuillEditor_update.bind(this)
    }

    handleQuillEditor_change (value) {
        // handleChange...
    }

    handleQuillEditor_update () {
       console.log('blur activated!')
    }


    render() {
        const cmsProps = this.props.cmsProps
        return (
            <div style={containerStyle}>

                  <ReactQuill value={this.state.content}
                              onChange={this.handleQuillEditor_change} 
                              onBlur={this.handleQuillEditor_update}/>

           </div>
        )           
    }
}

[jaimefps]

My solution was to move the blur handler to the div that wraps ReactQuill

[alexkrolick]

Going to consider this a duplicate of #276 - discussing future handling of blur events there

[sgwanlee]

My solution was to move the blur handler to the div that wraps ReactQuill

You saved my day!