在多个地方共享变更选项 (mutation options) 的最佳方式之一,就是使用 mutationOptions 辅助函数。在运行时,这个辅助函数会原样返回你传入的内容,但配合 TypeScript 使用时能带来诸多优势。你可以在一个地方定义变更操作的所有可能选项,同时还能获得完整的类型推断和类型安全。
export class QueriesService {
private http = inject(HttpClient)
updatePost(id: number) {
return mutationOptions({
mutationFn: (post: Post) => Promise.resolve(post),
mutationKey: ['updatePost', id],
onSuccess: (newPost) => {
// ^? newPost: Post
this.queryClient.setQueryData(['posts', id], newPost)
},
})
}
}
export class QueriesService {
private http = inject(HttpClient)
updatePost(id: number) {
return mutationOptions({
mutationFn: (post: Post) => Promise.resolve(post),
mutationKey: ['updatePost', id],
onSuccess: (newPost) => {
// ^? newPost: Post
this.queryClient.setQueryData(['posts', id], newPost)
},
})
}
}