Dev*_*o__ 3 javascript react-native redux rtk-query
我是 Redux 和 RTK 查询的新手,我不明白当另一个端点的响应成功时如何从另一个端点获取数据。
我创建了一个这样的 API:
import { Config } from '@/Config'
import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react'
const baseQuery = fetchBaseQuery({ baseUrl: Config.API_URL })
const baseQueryWithInterceptor = async (args, api, extraOptions) => {
let result = await baseQuery(args, api, extraOptions)
if (result.error && result.error.status === 401) {
// Deal with unauthorised
}
return result
}
export const api = createApi({
baseQuery: baseQueryWithInterceptor,
endpoints: () => ({}),
})
Run Code Online (Sandbox Code Playgroud)
我为每种资源都有一个模块,例如:
// /modules/matches
import { api } from '../../api'
import { fetchMatches } from '@/Services/modules/matches/fetchMatches'
export const matchApi = api.injectEndpoints({
endpoints: build => ({
fetchMatches: fetchMatches(build),
}),
overrideExisting: false,
})
export const { useFetchMatchesQuery } = matchApi
// /modules/matches/fetchMatches
export const fetchMatches = build => {
return build.query({
query: type => ({ url: `matches/${type}` })
})
}
Run Code Online (Sandbox Code Playgroud)
因此,在我的组件中,我用以下方式调用它:
const { data: matches, error, isLoading } = useFetchMatchesQuery('explorer')
Run Code Online (Sandbox Code Playgroud)
useFetchMatchesQuery现在,成功时我需要做的是:
useFetchMatchesQuery使用响应数据中的所有匹配 ID 创建一个数组matchsIds参数中的其他数据matches。这里的主要选项是在同一组件中拥有第二个useSomeOtherQuery()钩子,但“跳过”该查询直到第一个查询完成。{skip: false}这可以通过作为选项传递或skipToken变量作为查询参数来完成:
https://redux-toolkit.js.org/rtk-query/usage/conditional-fetching
| 归档时间: |
|
| 查看次数: |
4245 次 |
| 最近记录: |