Skip to main content
Version: 2.xx.xx

useCan

Usage​

useCan uses the can as the query function for react-query's useQuery. It takes the parameters that can takes. It can also be configured with queryOptions for useQuery. Returns the result of useQuery.

const { data } = useCan({
resource: "resource-you-ask-for-access",
action: "action-type-on-resource",
params: { foo: "optional-params" },
});

Performance​

As the number of points that checks for access control in your app increases the performance of your app may take a hit especially if its access control involves remote endpoints. Caching the access control checks helps a great deal. Since refine uses react-query it can be easily done configuring staleTime and cacheTime properties.

// inside your component

const { data } = useCan({
resource: "resource-you-ask-for-access",
action: "action-type-on-resource",
params: { foo: "optional-params" } },
queryOptions: {
staleTime: 5 * 60 * 1000, // 5 minutes
}
);

API​

Properties​

PropertyDescriptionTypeDefault
resource
Required
Resource name for API data interactionsstring
action
Required
Intenden action on resourcestring
paramsParameters associated with the resourceany
queryOptionsreact-query's useQuery options UseQueryOptions<
{ data: CanReturnType; },
TError>

Type Parameters​

PropertyDesription
CanReturnTypeResult data of the query HttpError

Return values​

DescriptionType
Result of the react-query's useQueryQueryObserverResult<{ data: CanReturnType; }>