如何在按钮单击时手动调用 Redux-toolkit-query

Question

我正在使用 Redux-toolkit-query 从服务器获取数据。现在我想在单击按钮时调用我的查询，而不是自动调用。我尝试了这个，但它不起作用。

const { data, refetch } = useGetBuisnessAreasQuery({
    enable: false,
    refetchOnWindowFocus: false,
    manual: true,
    refetchOnReconnect: false,
  });

Answer 1

您必须使用惰性查询挂钩：

const [ trigger, { data } ] = api.endpoints.getBuisnessAreas.useLazyQuery()

const onClick = () => {
  trigger()
}

Answer 2

这就是我所做的，它只是更干净：

在feature/service.ts：

export const authenticationApi = createApi({

    reducerPath: 'myApi',
    baseQuery: fetchBaseQuery({ baseUrl: baseUrl }),
    endpoints: builder => ({
        attemptLogin: builder.query({
            query: (credentials) => ({
                url: '/',
                body: JSON.stringify(body)
            })
        })
    })
})

export const { useLazyAttemptLoginQuery } = authenticationApi

并使用它：

const [getAuthenticated, { data, isLoading, error }] = useLazyAttemptLoginQuery()