Relational data in react-query

Question

I have a REST api which has this endpoint for getting an assignment -

'/classes/<str:code>/assignments/<int:assignment_id>'

I have created a custom hook for querying an Assignment:

const getAssignment = async ({ queryKey }) => {
    const [, code, assignmentId] = queryKey
    const { data } = await api.get(`/classes/${code}/assignments/${assignmentId}`)
    return data
}

export default function useAssignment(code, assignmentId) {
    return useQuery(['assignment', code, assignmentId], getAssignment)
}

This works as expected, but is this the right way to deal with relational data in react-query?

TkDodo · Accepted Answer · 2022-03-01 13:12:44Z

1

code looks right to me. react-query doesn't have a normalized cache, just a document cache. So if you request assignments with a different query key, e.g. assignments for a user, they will be cache separately.

The straight forward approach to tackle this would then be to structure your query keys in a way that you can invalidate everything at the same time.

answered Mar 1, 2022 at 13:12

TkDodo

30.4k5 gold badges84 silver badges99 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Relational data in react-query

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related