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 "@refinedev/core";
import dataProvider from "@refinedev/simple-rest";

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

export default App;

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

import { useDataProvider } from "@refinedev/core";

const dataProvider = useDataProvider();

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

API

Properties

Property	Description	Type	Default
dataProviderName	The name of the data provider you want to access	`string`	`default`

Return value

Description	Type
Data Provider	`Data Provider`

Usage​

API​

Properties​

Return value​

Usage

API

Properties

Return value