No rerender when updating data

I have a table of objects this.state.rows to be rendered into an interactive data table that allows user to modify a certain field. When user clicks on a row, my custom dialog will show up and ask information. When user accepte it, I modify the data by this.setState({rows: newRows}). The problem is no rerender occurs and the table remains unchanged.

Expected Behavior

The table updates as new data is pushed into.

Current Behavior

The table remains unchanged.

Steps to Reproduce (for bugs)

I simplify the step of showing dialog and mutating data. Just click the button “Change data” and all values of the first column will be appended “1”. https://codesandbox.io/s/yjv1o52o7z

Your Environment

Tech	Version
Material-UI	3.9.3
MUI-datatables	2.1.0
React	16.8.6
browser	Firefox 66.0.5 64bits

[gabrielliwerant]

You can use it that way if you want, and actually, you may not even need to use updateValue, because the render function will be integrated with the table, so it should trigger the state updates you’re looking for.

You can experiment with this example, that makes updates to the data directly in the “Delete” button: https://github.com/gregnb/mui-datatables/blob/master/examples/custom-action-columns/index.js. If you modify that code to change all the rows, it should also work.

Another experiment you can try is with the customToolbar which will let you add buttons and functions that impact the overall table data.

[gabrielliwerant]

@HeavenlyEntity, @perfectstrong It’s possible that your issue is the way you are attempting to update state. You may have an object reference issue. I describe that class of mistake here https://github.com/gregnb/mui-datatables/issues/1082.