react-quill onBlur not working

Question

私は反応アプリでリッチテキストエディタとしてreact-quillを使用しています。

テキストエディタのコンテンツをローカルのReact状態で保存し、値をRedux 'onBlur'に送信するだけです。私の問題は、フォーカスを取った後、テキストエディタの外にあるボタンをクリックするとonBlurが動作しなくなることです。 （つまり、onBlurは非インタラクティブな要素を画面上でクリックすると機能しますが、「保存」ボタンをクリックすると機能しません）。

現在のコード：

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> 
      )   
     } 
    } 

Answer 1

マイクイックフィックス：

  <div style={containerStyle} onBlur={this.handleQuillEditor_update}> 

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

      </div> 

Answer 2

私は同じエラーと私を通じて実行されていますので、同様に、QuillComponentのコンテナのdivにぼかしハンドラを動かしますこのコードの束でそれを修正しました。

<ReactQuill 
    onChange={(newValue, delta, source) => { 
       if (source === 'user') { 
        input.onChange(newValue); 
       }}} 
    onBlur={(range, source, quill) => { 
      input.onBlur(quill.getHTML()); 
      }} 
/>