Aborting Procedures

tRPC adheres to the industry standard when it comes to aborting procedures. All you have to do is pass an AbortSignal to the query-options and then call its parent AbortController's abort method.

composables/useGetTodo.ts
export default function useGetTodo(id: number) {
  const { $client } = useNuxtApp()
  const ac = new AbortController()

  onScopeDispose(() => {
    ac.abort()
  })
  
  return useAsyncData(() => {
    return $client.todo.getTodo.query(id, {
      signal: ac.signal
    })
  })
}