Actualmente estoy trabajando en el proyecto React js con "mui-datatables": "^4.2.2" .
Tengo una lista de datos dividida en páginas con la posibilidad de seleccionar un elemento a través de una casilla de verificación:
Mi problema :
cuando selecciono un elemento en la segunda página, el componente se vuelve a representar y vuelve automáticamente a la primera página.
Creo que el problema es un estado establecido dentro de onRowSelectionChange:
const options = { filter: false, onRowClick: (rowData, rowMeta) => { console.log("--rowData --"); console.log(rowData); console.log("--rowMeta --"); console.log(rowMeta); }, onRowSelectionChange: ( currentRowsSelected, allRowsSelected, rowsSelected ) => { let items = []; allRowsSelected.forEach((row) => { items.push(data[row.dataIndex]); }); setSelectedRows(items); },Como puedo solucionar este problema ?
debe almacenar el número de página en el estado y decir, por ejemplo curPage:1 cuando cambie la página, también debe actualizar curPage, ahora puede usar esto dentro de los accesorios de opciones que pasa a mui-datatable.así
const options = { page:this.state.curPage,//incase its class component onChangePage:(page)=>{ this.setState({curPage:page});//assuming its a class component }, filter: false, onRowClick: (rowData, rowMeta) => { console.log("--rowData --"); console.log(rowData); console.log("--rowMeta --"); console.log(rowMeta); }, onRowSelectionChange: ( currentRowsSelected, allRowsSelected, rowsSelected ) => { let items = []; allRowsSelected.forEach((row) => { items.push(data[row.dataIndex]); }); setSelectedRows(items); },espero que esto ayude