The onChange event is triggered event at the wrong moment

[nisiah78]

I use modal to "edit" or "add" content with rich text, edit means the content already exist and add means to add new content. when i want to edit content, the onChange event is already triggered when i open the modal box that will be my editor and here comes the issue, because the previous state will be applied to the new content that i am going to edit.

i did add onKeyUp but it doesn't work with mouse event

Here is my code

<ReactQuill id='description-en' theme='snow' className='' value={news?.description ?? ''} onChange={(content, delta, source, editor) => { if (editor.getLength() > 1 && Object.keys(news).length > 0) { setNews({ ...news, description: editor.getHTML() }); } }} onKeyUp={(event) => { if (news) setNews({ ...news, description: event.target.innerHTML, }); }} />

[erpardeepjain]

Any workaround so far? Facing same issue

[prrrcl]

I had the same problem. The "onChange" event only trigger when space key is pressed. In my case, it solve passing keyUp prop:

<ReactQuill
  ref={ref}
  modules={mods}
  theme="snow"
  value={value}
  onKeyUp={() => ref.current?.getEditor().getSelection()}
  onChange={onChange}
  onBlur={onBlur}
/>