state update on an unmounted component about react-flickity-component HOT 10 CLOSED

Unsubscribing listeners didn’t do the trick for me. I actually removed them altogether and still get the warning in my tests, and occasionally in the browser.

from react-flickity-component.

This error occurred to me when I didn't cleanup a listener after unmount. The fix is to unbind any events you're registering on unmount.

React.useEffect(() => {
    const listener = () => {
      const text = flkty.current.selectedElement.getAttribute('data-caption');
      setCaption(text);
    };

    flkty.current.on('select', listener);

    return () => flkty.current.off('select', listener);
}, []);

from react-flickity-component.

Im also having this issue

from react-flickity-component.

Can you create a reduced test case in codesandbox?

from react-flickity-component.

It's still happening. You can check it using your own demo:

See:
https://codesandbox.io/s/qlz12m4oj6

Just change the library version from 3.2.0 to 3.4.0. And check the (chrome) console.

https://codesandbox.io/s/react-flickity-94qi9

Apparently, it's working with 3.3.2, so I'll stick to it.

from react-flickity-component.

Has anyone been able to fix this?

from react-flickity-component.

Have you try the latest version? you need to install flickty as peer dependency

from react-flickity-component.

@nullhook ah! I didn't consider that because I was using the on attribute as part of Flickity options, so I've reconfigured it and I don't seem to be getting the error anymore. Thank you.

from react-flickity-component.

I am not sure why this case is closed... I am still running into the same issue even though I am cleaning up the listener in my useEffect after unmounting. Any suggestions on how to troubleshoot?

from react-flickity-component.

ensure you're component is properly unmounted - try logging from the unmount function and see if it triggers on unmount. also, it depends on how you're defining flickityRef - ensure the local reference to the Flickity component isn't null.

from react-flickity-component.