Skip to main content
Version: 3.xx.xx

useCustom

useCustom is a modified version of react-query's useQuery used for custom requests.

It uses the custom method from the dataProvider which is passed to <Refine>.

attention

useCustom should not be used when creating, updating or deleting a resource. To do these; useCreate, useUpdate or useDelete hooks should be used instead.

This is because useCustom, unlike other data hooks, does not invalidate queries and therefore will not update the application state either.

If you need to custom mutation request, use the useCustomMutation hook.

Features​

  • You can send a request to any link, using any of the methods (get, delete, head, options, post, put, patch).
  • You can send comprehensive requests to resources with Sort and Filter parameters.

Usage​

Let's make a use case. Lets say that we need to verify that the header in the post resource is unique. For this, we have an end-point similar to the one below.

https://api.fake-rest.refine.dev/posts/unique-check?title=Foo bar
{
"isAvailable": true
}
import { useCustom, useApiUrl } from "@pankod/refine-core";

interface PostUniqueCheckResponse {
isAvailable: boolean;
}

const apiUrl = useApiUrl();

const { data, isLoading } = useCustom<PostUniqueCheckResponse>({
url: `${apiUrl}/posts-unique-check`,
method: "get",
config: {
headers: {
"x-custom-header": "foo-bar",
},
query: {
title: "Foo bar",
},
},
});

API​

Properties​

PropertyDescriptionType
url
Required
URLstring
method
Required
Methodget, delete, head, options, post, put, patch
configThe config of your request. You can send headers, payload, query, filters and sort using this field.{ sort?: CrudSorting; filters?: CrudFilters; payload?: {}; query?: {}, headers?: {}; }
queryOptionsuseQuery Optionsobject
metaDataMetadata query for dataProviderMetaDataQuery
dataProviderNameIf there is more than one dataProvider, you should use the dataProviderName that you will use.string

Type Parameters​

PropertyDesriptionTypeDefault
TDataResult data of the query. Extends BaseRecordBaseRecordBaseRecord
TErrorCustom error object that extends HttpErrorHttpErrorHttpError
TQueryValues for query params.TQueryunknown
TPayloadValues for params.TPayloadunknown

Return value​

DescriptionType
Result of the react-query's useQueryQueryObserverResult<CustomResponse<TData>, TError>