Feature Request: Support watch Option in Nuxt Client Composable Mode for useAsyncData

[ajansen95]

Description

Summary

When using composable: 'useAsyncData' in the Nuxt client, the watch option should be supported to enable reactive re-fetching when specified dependencies change.

Current Behavior

Currently, when using the composable pattern with composable: 'useAsyncData', the generated Options type does not include the watch property, making it impossible to enable reactive data fetching directly through the API function options.

Current workaround:

// Must manually wrap the API call in useAsyncData
const { data } = await useAsyncData(
  () => `key-${selectedClubId.value}`,
  () => clubsControllerGetClubUsers({
    path: { clubId: selectedClubId.value },
  }),
  { watch: [selectedClubId] }, // watch option here
);

Desired Behavior

The watch option should be supported directly in the API function call when using composable: 'useAsyncData', allowing for cleaner code:

// Direct API call with watch option
const { data } = await clubsControllerGetClubUsers({
  composable: 'useAsyncData',
  key: 'club-users',
  path: { clubId: selectedClubId.value },
  watch: [selectedClubId], // should be supported
});

Benefits

1. Cleaner API: No need to manually wrap API calls in useAsyncData
2. Type Safety: The watch option would be properly typed
3. Consistency: Matches the pattern of using key and other composable options
4. Less Boilerplate: Reduces code duplication across Nuxt pages
5. Developer Experience: More intuitive for developers familiar with Nuxt composition API

Use Case

In a multi-tenant or multi-resource application where the same API endpoint is called with different parameters based on a reactive value (like a selected club ID), it's natural to want to reactively refetch the data when that dependency changes. The current pattern requires manually wrapping each such call in useAsyncData, which is verbose and error-prone.

Implementation Notes

The watch option would need to be:

• Added to the Options type definition when composable: 'useAsyncData'
• Passed through to the underlying useAsyncData call in the client implementation
• Properly typed to accept WatchSource<any>[] or similar