1

I get an warning when add a case : DELETE_SECRET in store redux

const mySecretsReducer = (state = initialState, action) => {
    switch (action.type) {
        case GET_MY_SECRETS:
            return {
                items: action.payload
            }
        case DELETE_SECRET:
            return {
                items: state.items.filter(e => e.id !== action.payload.id)
            }

        default:
            return state;

    }
}

after delete an element, i get warning:

index.js:1 Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in the componentWillUnmount method.
    in index (created by ConnectFunction)
    in ConnectFunction (at TopSecret/index.js:12)
    in div (at Top/index.js:11)
    in div (at Top/index.js:8)
    in index (at One/index.js:21)
    in div (at One/index.js:20)

Here is my func setState in component i were deleted

    deleteMySecret = () => {
        let params = {
            id: this.props.id
        }
        this.props.deleteMySecret(params)
            .then(res => {
                console.log(res.response);
                this.setState({ showPopConfirm: !this.state.showPopConfirm });

                }
            )
            .catch(res => {
                console.log(res.response);
                this.setState({ showPopConfirm: !this.state.showPopConfirm })
                }
            )
    }

    changeStatePopConfirm = () => {
        this.setState({ showPopConfirm: !this.state.showPopConfirm })
    }

How can i fix it.

An Dương
  • 179
  • 1
  • 4
  • 12
  • 2
    You are probably updating the state (via `setState`) in a components which previously rendered the item you removed from the state. – Scarysize Jun 07 '20 at 18:50
  • @Scarysize yes, and how can i fix it. – An Dương Jun 07 '20 at 18:55
  • 1
    Do not set state when component is mounted by checking if the [component is still mounted](https://github.com/jmlweb/isMounted) when the asynchronous tasks resolves. The code you posted has nothing to do with the error you are getting (I don't see any state setter function being called after async resolve) so can't give any more advice. – HMR Jun 07 '20 at 19:02
  • @Scarysize I am considering that i will ignore this warning. Is this warning important? – An Dương Jun 07 '20 at 20:19
  • 1
    @AnDương yes fix it, warnings should still be fixed and it will aid your understanding for future bugs – Red Baron Jun 07 '20 at 20:48
  • 2
    Thank everyone, i got solusition from here:https://stackoverflow.com/a/56537704/11221329 – An Dương Jun 08 '20 at 06:16

0 Answers0