Getting data with useFetchData

useFetchData is a utility hook for reading data from a data object's handler without populating the data object. It is useful when you need data once, want to perform several parallel requests, or don't need the stateful features of standard data objects. useFetchRecord (also exported as useFetchSingle) builds on this to return only the first matching record.

Interaction with DataObject handlers

Both hooks wrap the getData helper from @olenbetong/appframe-react, which calls the data object's internal handler. The handler executes the same retrieve logic used by refreshDataSource, but the records are returned directly instead of being stored on the data object. Filters and optional parameters are passed straight to the handler, so you still benefit from server-side filtering and paging.

Example

let {
record: driver,
loading: driverLoading,
refresh: refreshDriver,
} = useFetchSingle(dsDrivers, `[PersonID] = '${delivery.DriverID}'`);
let {
record: vehicle,
loading: vehicleLoading,
refresh: refreshVehicle,
} = useFetchSingle(dsObjectsVehicles, `[ObjectNo] = '${delivery.VehicleID}'`);
let {
data: elements,
loading,
refresh,
refreshRows,
} = useFetchData(dsDeliveriesElements, `[DeliveryTicketID] = ${delivery.DeliveryTicketID}`);

return (
<>
{(driverLoading || vehicleLoading || loading) && <LinearProgress />}
<Button onClick={refreshDriver}>Reload driver</Button>
<Button onClick={refreshVehicle}>Reload vehicle</Button>
<Button onClick={refresh}>Reload elements</Button>
{elements.map((element) => (
<ElementRow
key={element.PrimKey}
{...element}
onSave={() => refreshRows(`[PrimKey] = '${element.PrimKey}'`)}
/>
))}
</>
);

In this dialog component, several related records are fetched concurrently. refresh reloads all records, while refreshRows can update a single row after it has been saved on the server. The loading values allow the component to indicate when data is being retrieved.

When to prefer useFetchData over DataObjects

  • You only need read-only data and do not want to maintain current rows or dirty state.

  • Multiple unrelated requests should run in parallel.

  • Data should not persist after the component unmounts.

Standard data objects remain the better choice when you need to edit data, cache it locally, or rely on features like current row management and dirty tracking.

Last updated

Was this helpful?