- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我创建了多个 RTK 查询 API 服务,拆分成多个文件。对于这个问题,我有两个服务:“契约(Contract)”和“属性”。契约(Contract)服务应该能够在契约(Contract)更新时使属性缓存失效,但即使在向契约(Contract)服务提供“Properties”标签之后 - 缓存也不会失效。
这是我的设置:
属性:
export const propertyApi = createApi({
reducerPath: 'propertyApi',
baseQuery: fetchBaseQuery({ baseUrl: `${API_BASE_URL}/properties` }),
tagTypes: ['Properties'],
endpoints: builder => ({
// many endpoints
})
})
export const {
// many hooks
} = propertyApi
契约(Contract):
export const contractApi = createApi({
reducerPath: 'contractApi',
baseQuery: fetchBaseQuery({ baseUrl: `${API_BASE_URL}/contracts` }),
tagTypes: ['Contracts', 'Properties'],
endpoints: builder => ({
// ...
modifyContract: builder.mutation<Contract, { contract: Partial<ContractDto>, contractId: Contract['id'], propertyId: Property['id'] }>({
query: ({ contract, contractId }) => {
return {
url: `/${contractId}`,
method: 'PATCH',
credentials: "include",
body: contract
}
},
// to my understanding, this should invalidate the property cache for the property with 'propertyId', but it doesn't seem to work
invalidatesTags: (_res, _err, { propertyId }) => ['Properties', 'Contracts', { type: 'Properties', id: propertyId }]
})
})
})
export const {
// ...
useModifyContractMutation
} = contractApi
商店设置:
export const STORE_RESET_ACTION_TYPE = 'RESET_STORE'
const combinedReducer = combineReducers({
[photoApi.reducerPath]: photoApi.reducer,
[authApi.reducerPath]: authApi.reducer,
[propertyApi.reducerPath]: propertyApi.reducer,
[cronApi.reducerPath]: cronApi.reducer,
[contractApi.reducerPath]: contractApi.reducer,
auth: authReducer
})
const rootReducer: Reducer = (state: RootState, action: AnyAction) => {
if (action.type === STORE_RESET_ACTION_TYPE) {
state = {} as RootState
}
return combinedReducer(state, action)
}
export const store = configureStore({
reducer: rootReducer,
middleware: (getDefaultMiddleware) => {
return getDefaultMiddleware().concat([
photoApi.middleware,
authApi.middleware,
propertyApi.middleware,
cronApi.middleware,
contractApi.middleware,
errorHandlerMiddleware
])
}
})
setupListeners(store.dispatch)
export type AppDispatch = typeof store.dispatch
export type RootState = ReturnType<typeof store.getState>
export type AppThunk<ReturnType = void> = ThunkAction<
ReturnType,
RootState,
unknown,
Action<string>
>
export const useAppDispatch = () => useDispatch<AppDispatch>()
export const useAppSelector: TypedUseSelectorHook<RootState> = useSelector
最佳答案
如果这些 api 服务具有相互依赖的数据(这有点暗示它们应该相互无效)它们不应该是多个 api 服务 - 它们实际上只是多个端点一个API。我们在文档中的多个位置进行了说明。
引用 the quickstart tutorial例如:
Typically, you should only have one API slice per base URL that your application needs to communicate with. For example, if your site fetches data from both /api/posts and /api/users, you would have a single API slice with /api/ as the base URL, and separate endpoint definitions for posts and users. This allows you to effectively take advantage of automated re-fetching by defining tag relationships across endpoints.
相反,如果您想将一个 api 拆分成多个文件,您可以这样做 - 使用 code splitting文档中描述的机制。
这也意味着您不必在 configureStore
调用中添加很多 api 片段和中间件,只需添加一个即可。
关于reactjs - RTK查询 |使来自另一个 API 服务的 API 服务的缓存无效,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/69243083/
使用RTK Query,推荐使用哪种方式依次进行多个突变? const [ updateProfile, ] = useUpdateProfileMutation(); const
我正在使用 REDUX-TOOLKIT-QUERY,现在我有一种情况,我必须调用一个突变。一旦该突变返回响应,我必须在其他三个突变中使用该响应作为请求参数。我们如何才能以正确的方式实现它? const
我正在尝试在货币转换器应用程序中使用 RTK 查询。此应用基于 2 个 API。 首先,我要获取一个包含货币的对象。然后,我获取了一系列国家并对其进行过滤,具体取决于该国家是否拥有那种货币。 商店代码
在我的 React 应用中,我使用 RTK 查询来获取数据。我有 10+ API 端点和每个端点的路由。 我想在页面顶部显示一条水平线,以表明正在进行数据提取。 目前,我已经做到了。 const Ar
试图理解 RTK 查询以及如何在 React 应用程序中最佳地使用它。 我有一个 Search我的应用程序的一部分中的组件。执行搜索时,我希望结果出现在另一个区域,远离组件树。 我在文档中看到的所有示
当我移动下一页或移动到另一个页面或更新数据时...数据不重新获取...当我重新加载页面然后重新获取数据...无需重新加载如何使用 RTK 查询重新获取数据.. 这是代码 export const us
我有一系列组件,它们都使用来自 RTK 查询响应的数据。虽然来自具有相同查询参数的相同响应,但每个组件都需要数据通过一组相对昂贵的客户端过滤器(其参数是 redux 存储切片属性),每个组件可能不相同
我有一系列组件,它们都使用来自 RTK 查询响应的数据。虽然来自具有相同查询参数的相同响应,但每个组件都需要数据通过一组相对昂贵的客户端过滤器(其参数是 redux 存储切片属性),每个组件可能不相同
我正在使用 RTK(Redux 工具包)和 RTK 查询来管理我的商店和 API 请求。 为了在全局范围内捕获错误,我遵循了 this example .这工作正常,但现在我想在请求因 401 - U
getDefaultMiddleware 从哪里来?我正在阅读 docs它似乎神奇地出现在配置商店中。虽然这很好,但它并没有进入我的商店,而且......因为没有这个功能的导入路径而且我不知道如何解决
我正在尝试使用 RTK 获取一些数据。 GET 方法工作正常。 POST 方法也有效,但不会改变数据。我也为自动重新获取添加了 provideTags 和 invalidateTags,但仍然无法成功
很难为这个问题找到好的答案/解决方案。 我有一个 POSTS 列表组件,允许删除单个 POST 行。 我正在使用普通的 queryMutation 进行删除: 实现 deletePostById: b
您好,我最近学习了带有 rtk 查询工具的新 React 工具包,我正在尝试使用 rtk 包中的 createApi 将登录系统放在一起。 在按下登录按钮对其进行测试后,我看到网络请求顺利通过(状态代
我昨天刚开始使用 redux,在阅读了不同的库之后,我决定使用 RTK 的切片路由。 对于我的异步,我决定使用 RTK 查询而不是使用 createAsyncThunk,并且我对从另一个切片访问状态的
我正在尝试使用 RTK 查询通过异步函数设置我的 contactSlice.ts 的初始状态。 我已经阅读了文档并在网上进行了搜索,但没有找到适合该问题的解决方案。 contactsAPI.ts: i
我使用 rtk 查询,我想为所有请求通过 header 身份验证,除了没有 header 的刷新 token ,这是我的代码有没有办法让条件或通过 header 为空?或者我可以有 2 个 fetch
我是 Redux 和 RTK 查询的新手,我不明白当另一个端点响应成功时如何从另一个端点获取数据。 我创建了一个这样的 API: import { Config } from '@/Config' i
我是 Redux 和 RTK 查询的新手,我不明白当另一个端点响应成功时如何从另一个端点获取数据。 我创建了一个这样的 API: import { Config } from '@/Config' i
我正在尝试在 Windows 10 的 Visual Studio 中使用 C++ 从 Piksi rtk 套件获取数据。我正在使用 libsbp 库。 但我无法用 C++ 编译 C 示例。我还附上了
这真是个问题。当没有用户时,我需要跳过该请求。我试着做这个做那个。但每次我出错。告诉我怎么才能让它正常工作。。我试着做这个做那个
我是一名优秀的程序员,十分优秀!