He hecho una aplicación basada en este ejemplo.
https://codesandbox.io/embed/table-sorting-example-ur2z9?fontsize=14&hidenavigation=1&theme=dark
Pero también necesito actualizar los datos en la tabla (agregar, eliminar)
yo suelo
const { items, requestSort, sortConfig } = useSortableData(data.items, sortObj); const [datarows, setDatarows] = useState({}) useEffect(() => { setDatarows(items) }); const updateData = (row, useropt) => { ... /* here fetching some data */ ... setDatarows(rows2); }Pero después de la actualización de datos, la función useSortableData está clasificando los datos agregados inicialmente. ¿Cómo hacer que useSortableData use datos actualizados?
He intentado
const [datarows, setDatarows] = useState(data.items) const { items, requestSort, sortConfig } = useSortableData(datarows, sortObj);Pero en este caso obtengo
Error de tiempo de ejecución no controlado
TypeError: intento no válido de difundir una instancia no iterable. Para ser iterables, los objetos que no son de matriz deben tener un método Symbol.iterator.
Gracias
Mirando el código que proporcionó, parece que useSortableData tiene elementos como una dependencia en el useMemo de sortedItems. Lo que significa que cualquier cambio en data.items dará como resultado un nuevo cálculo de los elementos ordenados.
No ha proporcionado la pieza de código de donde obtiene los elementos de datos, por lo tanto, esta es la medida en la que puedo ayudar
Resuelto.
Carga de datos y cambio a la izquierda en el componente principal. La tabla y la clasificación const { items, requestSort, sortConfig } = useSortableData(data.items, sortObj); movido a otro componente