invokeThis is for imperatively invoking queries or mutations from your components.
import { invoke } from "blitz"
import getProducts from "app/products/queries/getProducts"
const Page = function ({ products }) {
return (
<div>
<button
onClick={async () => {
const products = await invoke(getProducts, {
where: { orgId: 1 },
})
}}
>
Get Products
</button>
</div>
)
}
export default Pageconst results = await invoke(resolver, resolverInputArguments)resolver: A Blitz query resolver or
mutation resolverresolverInputArgumentsresolverresultsinvalidateQueryThis allows you to invalidate a specific query. Use invalidateQuery if
you know for sure that a query's data is stale and you don't want to wait
for the automatic refetch.
import { invalidateQuery } from "blitz"
import getProducts from "app/products/queries/getProducts"
const Page = function ({ products }) {
return (
<div>
<button
onClick={() => {
invalidateQuery(getProducts)
}}
>
Invalidate
</button>
</div>
)
}
export default Pageconst refetchedQueries = await invalidateQuery(resolver, inputArgs?)resolver: A Blitz query resolver or
mutation resolverinputArgsresolverresolver queriesresolver
with matching inputArgsThis function returns a promise that will resolve when all of the queries are done being refetched.
getQueryKeyThis allows you to get the query key for a query. The queryClient
manages query based on query keys. For a more detailed explanation, see
the React Query
documentation.
import { getQueryKey, queryClient } from "blitz"
import getProducts from "app/products/queries/getProducts"
const Page = function ({ products }) {
return (
<div>
<button
onClick={async () => {
const queryKey = getQueryKey(getProducts)
queryClient.invalidateQueries(queryKey)
const queryKey = getQueryKey(getProducts, {
where: { ordId: 1 },
})
queryClient.invalidateQueries(queryKey)
}}
>
Invalidate
</button>
</div>
)
}
export default Pageconst queryKey = getQueryKey(resolver, inputArgs?)resolver: A Blitz query resolver or
mutation resolverinputArgsresolverresolver queriesresolver and inputArgs combinationresultssetQueryDataWorks the same as the
setQueryData returned by useQuery. The
difference is that it's not bound to the useQuery and expects the
resolver and the inputArgs instead. It will also invalidate the query
causing a refetch. Disable refetch by passing an options object
{refetch: false} as the opts argument.
import { setQueryData } from "blitz"
export default function (props: { query: { id: number } }) {
const [product] = useQuery(getProduct, {
where: { id: props.query.id },
})
const [updateProjectMutation] = useMutation(updateProject)
return (
<Formik
initialValues={product}
onSubmit={async (values) => {
try {
const product = await updateProjectMutation(values)
setQueryData(
getProduct,
{ where: { id: props.query.id } },
product
)
} catch (error) {
alert("Error saving product")
}
}}
>
{/* ... */}
</Formik>
)
}const promise = setQueryData(resolver, inputArgs, newData, opts?)resolver: A Blitz query resolver.inputArgsresolverresolver and inputArgs
combinationnewDataopts{refetch: false}.results