DataTable + Virtualization: Maximum update depth exceeded

I have a DataTable with virtualization and when scrolling past ~70% of the way it gets sticky, but I only found this mentioned here: https://github.com/plotly/dash-table/issues/234#issuecomment-441103313

Here’s the complete DataTable code:

DataTable(
        id='table',
        columns=columns,
        data=df.to_dict('records'),
        style_cell={
            'overflow': 'hidden',
            'textOverflow': 'ellipsis',
            'minWidth': '0px',
            'maxWidth': '180px',
        },
        editable=True,
        sort_action='native',
        filter_action='native',
        hidden_columns=['id', ],
        # Virtualization in small tables doesn't look very good,
        # e.g. it will show 0-1 rows out of 3
        virtualization=len(df) >= 15,
        style_table={'maxHeight': '300px'},
        **kwargs
    )

Any idea where I might be going wrong? There is no extra CSS styling interfering, nor any table interactivity (the user presses a button which then refreshes the page, so that shouldn’t be a problem).

Edit for additional details:

Ccomplete traceback
Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops.
12:24:27 PM
Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops.
(This error originated from the built-in JavaScript code that runs Dash apps. Click to see the full stack trace or open your browser's console.)
Invariant Violation: Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number of nested updates to prevent infinite loops.

    at invariant (http://127.0.0.1:8050/_dash-component-suites/dash_renderer/react-dom@16.8.6.js?v=1.1.1&m=1570637795:49:15)

    at scheduleWork (http://127.0.0.1:8050/_dash-component-suites/dash_renderer/react-dom@16.8.6.js?v=1.1.1&m=1570637795:20051:5)

    at Object.enqueueSetState (http://127.0.0.1:8050/_dash-component-suites/dash_renderer/react-dom@16.8.6.js?v=1.1.1&m=1570637795:11304:5)

    at t.Component.setState (http://127.0.0.1:8050/_dash-component-suites/dash_renderer/react@16.8.6.js?v=1.1.1&m=1570637795:423:16)

    at http://127.0.0.1:8050/_dash-component-suites/dash_table/bundle.js?v=4.4.0&m=1570637796:19:184556

    at t.value (http://127.0.0.1:8050/_dash-component-suites/dash_table/bundle.js?v=4.4.0&m=1570637796:19:166637)

    at t.r.applyStyle (http://127.0.0.1:8050/_dash-component-suites/dash_table/bundle.js?v=4.4.0&m=1570637796:19:164173)

    at t.value (http://127.0.0.1:8050/_dash-component-suites/dash_table/bundle.js?v=4.4.0&m=1570637796:19:167487)

    at commitLifeCycles (http://127.0.0.1:8050/_dash-component-suites/dash_renderer/react-dom@16.8.6.js?v=1.1.1&m=1570637795:17484:22)

    at commitAllLifeCycles (http://127.0.0.1:8050/_dash-component-suites/dash_renderer/react-dom@16.8.6.js?v=1.1.1&m=1570637795:18871:7)
1 Like