Skip to main content
Version: 3.xx.xx
Source Code


<CanAccess> is the component form of useCan.

It internally uses useCan's return values to provide its functionality.

Passes the given properties to the can method from your access control provider. After, if it returns:

  • true, it renders the children.
  • false, it renders fallback prop if provided. Otherwise, it renders null.

Refer to Access Control Provider for more information.

Basic Usage

import { CanAccess } from "@pankod/refine-core";

const MyComponent = () => (
params={{ id: 1 }}
fallback={<CustomFallback />}
<YourComponent />


It's also accepts all the properties of useCan.


Component to render if useCan returns false. If undefined, it renders null.

<CanAccess fallback={<div>You cannot access this section</div>}>
<YourComponent />

API Reference