Bring Drag & Drop to Dash with Dashboard Engine. 💫 Learn how at our next webinar!

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

Hi, has anyone ever meet this error?

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.

My application suddenly got this error recent a few days and I’ve no idea what the cause could be. Can anyone give me some hint? Thanks!

1 Like

I am also getting similar warning for this below psudo code

app.clientside_callback(
    """
    function( dropdown_value, children, children_source) {
        const triggered = dash_clientside.callback_context.triggered.map(t => t.prop_id);

        if(triggered[0].split('.')[0] === 'main-app-dropdown'){
            children_source = children_source.concat(children);
            children= [];
            const ids_to_be_added = [];
            const dropdown_value_set = new Set(dropdown_value);
            
            for(let i=0; i<children_source.length; i++){
                if (dropdown_value_set.has(children_source[i]['props']['id'])){
                    ids_to_be_added.push(i);
                    }
            }
            
            for(let i=ids_to_be_added.length-1; i>=0; i--){
                const child = children_source.splice(ids_to_be_added[i], 1)[0];
                children.push(child);
            }
            
            return [children, children_source];
        }
    }
    """,
    [Output('drag-container', 'children'),
     Output('source-container', 'children')],
     Input('main-app-dropdown', 'value'),
    [State('drag-container', 'children'),
     State('source-container', 'children')],
    prevent_initial_call=True
)
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 s (created by s)
    in s (created by s)
    in div (created by s)
    in s (created by s)
    in s (created by s)
    in s (created by c)
    in Suspense (created by c)
    in c (created by CheckedComponent)
    in CheckedComponent (created by BaseTreeContainer)
    in ComponentErrorBoundary (created by BaseTreeContainer)
    in BaseTreeContainer (created by Context.Consumer)
    in Unknown (created by BaseTreeContainer)
    in div (created by i)
    in i (created by CheckedComponent)
    in CheckedComponent (created by BaseTreeContainer)
    in ComponentErrorBoundary (created by BaseTreeContainer)
    in BaseTreeContainer (created by Context.Consumer)
    in Unknown (created by BaseTreeContainer)
    in div (created by CardBody)
    in CardBody (created by Kn)
    in Kn (created by CheckedComponent)
    in CheckedComponent (created by BaseTreeContainer)
    in ComponentErrorBoundary (created by BaseTreeContainer)
    in BaseTreeContainer (created by Context.Consumer)
    in Unknown (created by BaseTreeContainer)
    in div (created by t)
    in t (created by ForwardRef)
    in ForwardRef (created by ForwardRef)
    in ForwardRef (created by ForwardRef)
    in ForwardRef (created by CheckedComponent)
    in CheckedComponent (created by BaseTreeContainer)
    in ComponentErrorBoundary (created by BaseTreeContainer)
    in BaseTreeContainer (created by Context.Consumer)
    in Unknown (created by BaseTreeContainer)
    in div (created by Card)
    in Card (created by Fn)
    in Fn (created by CheckedComponent)
    in CheckedComponent (created by BaseTreeContainer)
    in ComponentErrorBoundary (created by BaseTreeContainer)
    in BaseTreeContainer (created by Context.Consumer)
    in Unknown (created by BaseTreeContainer)