Skip to content

Commit fa92912

Browse files
committed
Document how to enable a list based on its params
1 parent 2064847 commit fa92912

File tree

1 file changed

+20
-0
lines changed

1 file changed

+20
-0
lines changed

docs/List.md

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1174,6 +1174,26 @@ const ProductList = () => (
11741174
)
11751175
```
11761176

1177+
## Enabling Data Fetching Conditionally
1178+
1179+
You might want to allow data to be fetched only when at least some filters have been set. You can leverage TanStack react-query `enabled` option for that. It accepts a function that receives the query as its only parameter. As react-admin always format the `queryKey` as `[ResourceName, DataProviderMethod, DataProviderParams]`, you can check that there is at least a filter in this function:
1180+
1181+
```tsx
1182+
export const PostList = () => (
1183+
<List
1184+
filters={postFilter}
1185+
queryOptions={{
1186+
enabled: query => {
1187+
const listParams = query.queryKey[2] as GetListParams;
1188+
return listParams.filter.q?.length > 2;
1189+
}
1190+
}}
1191+
>
1192+
{/* DataGrid */}
1193+
</List>
1194+
)
1195+
```
1196+
11771197
## Accessing Extra Response Data
11781198

11791199
If `dataProvider.getList()` returns additional metadata in the response under the `meta` key, you can access it in the list view using the `meta` property of the `ListContext`.

0 commit comments

Comments
 (0)