React-quilljs error when updating my state variable

Question

I am using react-quilljs and I want to set an intial value to it and at the same time I want to set my output variable via setState of useState whenever the text changes so I can use the state variable to in saving the data when user click save button.

React.useEffect(() => {
    
    if (quill) {
        quill.clipboard.dangerouslyPasteHTML(initialData);
        quill.setSelection(quill.getLength(), 0);
        quill.on('text-change', (delta, oldDelta, source) => {
            console.log('Text is Changed');
            getData(quill.root.innerHTML); // this is my setState
        });
    }
}, [quill]);

But I got this error

It seems my setState triggers re render and make the editor go back to its initial value.

Can anyone guide me on how I can get my quilleditor output.