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

useDataProvider

useDataProvider is a React hook that returns the dataProvider which is passed to <Refine> component.

It is useful when you have multiple data providers and you want to access one of them.

Usage

Let's say we have two data providers:

import { Refine } from "@pankod/refine-core";
import dataProvider from "@pankod/refine-simple-rest";

const App = () => {
return (
<Refine
dataProvider={{
default: dataProvider("API_URL"),
second: dataProvider("SECOND_API_URL"),
}}
/>
);
};

export default App;

Now we can access the data providers with the useDataProvider hook:

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

const dataProvider = useDataProvider();

const defaultDataProvider = dataProvider(); // return default data provider
const secondDataProvider = dataProvider("second"); // return second data provider

API

Properties

PropertyDescriptionTypeDefault
dataProviderNameThe name of the data provider you want to accessstringdefault

Return value

DescriptionType
Data ProviderData Provider