Ранее я писал о RTK, в этом рассказе будут освещены другие подробности его использование.


Представьте, что нам нужно отображать одни и те же данные, но из разных ресурсов в зависимости от входящего значения параметра. В этом случае у нас будет компонент с двумя хуками, которые обрабатывают запросы и получают данные.


В основном представление API выглядит так:


```машинопись


экспортировать константу configApi = baseApi.injectEndpoints({


конечные точки: построить => ({


fetchConfigDetails: build.query({


запрос: arg => /config-details,


transformResponse: (x: IResponse) => x.result,


ОбеспечиваетТеги: ['Детали конфигурации'],


fetchConfigRunDetails: build.query({


запрос: arg => /${arg.id}/config-details,


transformResponse: (x: IResponse) => x.result,


ProvideTags: ['ConfigRunDetails'],


overrideExisting: правда,


Он имеет две конечные точки, и основное различие между ними заключается в аргументе «id», поэтому на самом деле ресурсы разные. Таким образом, кеш также будет другим: один для ==ConfigDetails== и один для ==ConfigRunDetails==.


Для пояснения того, откуда хуки берут свои имена, я приведу следующий пример:


```машинопись


экспортировать константу {


использованиеFetchConfigDetailsQuery,


использоватьFetchConfigRunDetailsQuery,


} = configApi;


Имя хука состоит из префикса use, имени конечной точки ==fetchConfigDetails== и постфикса типа запроса (функция, которая используется для создания конечной точки) build.query → ==useFetchConfigDetailsQuery==.


И эти два хука будут использоваться в одном компоненте:


```машинопись


const RowResultsDetails: React.FC = () => {


const {id} = useParams();


const fetchDetails = useFetchConfigDetailsQuery(


пропустить: !!id,


selectFromResult: ({ data, isFetching }) => ({


isFetching: isFetching,


данные: selectConfigDetails(данные),


const fetchRunDetails = useFetchConfigRunDetailsQuery(


{ я бы },


пропустить: !id,


selectFromResult: ({ data, isFetching }) => ({


isFetching: isFetching,


данные: selectRunConfigDetails(данные),


const {данные, isFetching} = идентификатор? fetchRunDetails: fetchDetails;


возврат (


<дел>


({data.length})