Course lesson

Use Refetch from Vue 3 useQuery Composable to Ensure Fresh Data

Since we are preventing a page refresh on form submit, we don't see that our data is updated in the UI until we manually refresh the page.

Duration
1 min
Access
Included
Transcript
Retained from source evidence

Since we are preventing a page refresh on form submit, we don't see that our data is updated in the UI until we manually refresh the page.

We can display the correct data without a refresh by using the refetch method from the composable useQuery. In this lesson, we will emit an updated event that triggers a handleRefresh method, inside of which is a call to refetch.