Estoy usando Material-Table en una aplicación React . Habilité el filtrado y, después, usé filterComponent de Material-Table .
Tengo problemas para recuperar el valor del componente personalizado Column1FilterComponent o pasar una función que puede desencadenar un cambio de estado, y luego podría desencadenar una búsqueda. Coloqué mi función setFetchState(...) en el punto que me gustaría que fuera. Aquí hay un ejemplo: https://codesandbox.io/s/material-table-playground-forked-simple-q05vhf
Aquí están mis preguntas: ¿Cómo obtener valor de un filterComponent? ¿Cómo pasar una función a filterComponent?
export function SomethingTable(props) { const { fetchState, setFetchState } = props; const [randomData, setRandomData] = useState([ { filename: "1", another: "two" }, { filename: "2", another: "three" }, { filename: "3", another: "four" }, { filename: "4", another: "five" }, { filename: "5", another: "six" } ]); return ( <MaterialTable title="Something" columns={[ { title: "Column1", field: "filename", type: "numeric", width: "10%", filterComponent: (props) => <Column1FilterComponent {...props} /> }, { title: "Column2", field: "another" } ]} data={randomData} /*onFilterChange={(filters) => { console.log("filters", filters); }}*/ options={{ filtering: true }} /> ); } function Column1FilterComponent(props) { const [value, setValue] = useState(""); return ( <TextField id="area-text" value={value} onChange={(event) => { setValue(event.target.value); //My set function: // setFetchState(event.target.value); props.onFilterChanged(props.columnDef.tableData.id, event.target.value); }} /> ); }