When I try to initialize the virtual list i get the following error message and I don't really understand why :
Argument of type 'AppItem[] | undefined' is not assignable to parameter of type 'MaybeRef<AppItem[]>'.
Type 'undefined' is not assignable to type 'MaybeRef<AppItem[]>'.ts(2345)
Here is the initialization of the virtual list in my Vue Component
const { apps, isLoading, error } = useApps();
const { list, containerProps, wrapperProps } = useVirtualList(apps.value, {
itemHeight: 22,
});
This is the hook where I retrieve my data : apps. I'm not sure if this is the cause of the error, but I use tanstack query
const useApps = () => {
const params = reactive({
appName: "",
state: "",
bucket: "",
});
const {
isLoading,
data: apps,
error,
} = useQuery(["apps"], () => getApps(params));
return { isLoading, apps, error, params };
};
You probably should provide default: []
to your useQuery
and use apps
ref as is if you want it to retain reactivity
The problem is you are missing "or []" somewhere - either in useQuery(..., [])
, computed(() => apps.value ?? [])
or apps.value ?? []