Warning: Can't call setState

[sirvival3]

When I click on the editor I get this warning in the console:

Warning: Can't call setState on a component that is not yet mounted. This is a no-op, but it might indicate a bug in your application. Instead, assign to this.state directly or define a state = {}; class property with the desired state in the r component.

I made a codeSandbox where it is too: https://codesandbox.io/s/brave-architecture-4zpm5

[sirvival3]

Its only in StrictMode I get the warning: https://codesandbox.io/s/strange-monad-lxtuu?file=/src/index.js

[sahildhiman]

@sirvival3 did you find the solution of this issue. I am getting same problem?

[megarg]

Is there any solution to this? I am getting the same error.

[kitman20022002]

Me too

[juicyjelly74]

Same error

[Salalf01]

Any news about this warning?

[yusuf-khamis]

This issue still persists, and there is a PR pending to be merged which i believe fixed the issue, can the owner kindly review and merge the PR

[appadminlx]

@jpuri is there any chance we can have PR merged which fixes the issue?

[Jrgsto]

Any news?

[BaniGrisson]

Is this thing abandoned?

[bubbster95]

Literally checked so many boards all the same desperate cries for help. #mergethedangfix

[siddjain]

I would like to understand why does this warning not appear in some demos? E.g., the demo at https://jpuri.github.io/react-draft-wysiwyg/#/ does not give the warning.

[stormdotcom]

any fix?

[BaniGrisson]

For me its not the error itself. It's knowing that there is a solution ready but apparently noone paying attention to mantaining this package. I'll just use CKE.

[maxlech974]

hmmm still have this issue, I use Next.js and I try to disable reactStrictMod, but no result... :s

[taimoorimran]

Guys any fix yet? -_-

[sabbirshawon]

I got the same error

[Yidi0213]

also got the same error

[owen-soak]

@jpuri Any word on if the possible fix https://github.com/jpuri/react-draft-wysiwyg/pull/1044 could be merged? Thanks in advance.

[tylertaewook]

@jpuri any fixes yet??

[xeqtrTC]

Still same error.

[kiknaio]

Still no fixes I see :|

[keithics]

We replaced it with React Quill instead because of this issue.

[angelinuxx]

Still same error.

[ggenilson]

Still same error!

[alexeysarakuz]

The same... 😢😢😢

[berryboylb]

Doesn't anyone care about this package i'm getting the same error

[PixiLoop]

i'm also facing the same problem

[SelmiAbderrahim]

Somehow worked by Just removing "StrictMode" from my app.

[cheezballs]

Ok, so is this project dead or what? Ignoring this bug for 2 years is insane. "just remove strict mode" is not a solution. Definitely not a prod-ready lib anymore.

[EricHasegawa]

Almost three years later - having the same issue lol

[mszula]

Haha, I got exactly the same right now 😂 Is there any plans to fix this bug? "remove strict mode" is definitely not a solution. We're serious men and we doing serious software 😄

[ilhamksyuriadi]

any update for this? still got the same error

[EricHasegawa]

@ilhamksyuriadi and anyone else who ends up here - if you look at this issue here it seems like this package has a sole maintainer who has a lot on their plate. I wouldn't count on a fix anytime soon :(

[quocbahuynh]

any solution? I have same problem with Next JS

[tonikny]

One more with the same problem on Next.js :disappointed:

[quocbahuynh]

Do you have other libraries?

[ilhamksyuriadi]

@EricHasegawa for my case, I already moved to react quill

[Grindhead]

same over here

[Mark-LohseMiranda]

We replaced it with React Quill instead because of this issue.

Thanks for this...so much easier

[IbrahimO123]

Use React Quill instead

[web-2017]

Try this, should work

import { Editor } from 'react-draft-wysiwyg' 
import { EditorState } from 'draft-js'
const [editorState, setEditorState] = useState(EditorState.createEmpty())
const [isMounted, setIsMounted] = useState(false)
useEffect(() => {
    setIsMounted(true)
       return () => {
        setIsMounted(false)
    }
}, [])

<div  className="order_detail">
        {isMounted && (
            <Editor
                editorState={editorState}
                wrapperClassName="editor"
                editorClassName="demo-editor"
                onEditorStateChange={setEditorState}
                onChange={handleChange}
            />
        )}
    </div>`

[mvshvets]

Попробуйте это, должно сработать

import { Editor } from 'react-draft-wysiwyg' 
import { EditorState } from 'draft-js'
const [editorState, setEditorState] = useState(EditorState.createEmpty())
const [isMounted, setIsMounted] = useState(false)
useEffect(() => {
    setIsMounted(true)
       return () => {
        setIsMounted(false)
    }
}, [])

<div  className="order_detail">
        {isMounted && (
            <Editor
                editorState={editorState}
                wrapperClassName="editor"
                editorClassName="demo-editor"
                onEditorStateChange={setEditorState}
                onChange={handleChange}
            />
        )}
    </div>`

It didn't work for me

[devsomda]

Still same 🥲🥲

[jhoberterato]

it's now 2024 but still a problem

[Clarence161095]

Thank you, This is my needed

[rangga-synergy]

this error is annoying.

[hossein-ahmadi-021]

Please don't write a package if you can't support it :)

[cheezballs]

What an absolute joke of a project. People BEGGING you to merge PRs to fix SIMPLE bugs which you ignore. You'd be better off deleting this than keeping it around for your resume.

[bienvenuushindi]

Switching to React Quill because of this issue