CODEWITHSUNDEEP
reactjsredux-toolkitrtk-query
Rajanboy
Rajanboy

Reputation: 2682

rtk query doesn't update api data

I'm using rtk query to fetch data and show in component. I can see data is coming and i can get data in frontend. Here is the values i get from query ,

const { currentData, isFetching, isError } = useListStudentQuery()

It put it on Home.js and fetched data .

If i navigate to /create/student from Link in Header and create a mutation to create a student.

const navigate = useNavigate()
const [createStudent, {data, isError, isLoading, isSuccess, error}] = useCreateStudentMutation();

useEffect(() => {
    // if success
        if(isSuccess){
        navigate("/")
    })

If success i would be navigate to / . When i do so , i cant see my updated list, rather only old list . In Home.js As per documentation for showing data i've just returned data like this

return (
   currentData && currentData.students.map(student => (
            <Table list={student} key={student._id}/>
))
)

Is there something wrong i'm doing. Very thankful for your help.

Upvotes: 1

Views: 7718

Answers (1)

phry
phry

Reputation: 44336

RTK Query is a cache. As such it has the job of keeping server responses in state and not causing unnecessary requests.

If your mutation changed something another query relied on, you have to tell RTK Query to refetch that data from the server - using automatic invalidation with providesTags and invalidatesTags.

I would highly recommend you read chapters 7 and 8 of the Redux tutorial

Upvotes: 2

Related Questions