$derived(( {children: nav?.items} )) Property 'items' does not exist on type 'never'.ts(2339)
Closed this issue · 1 comments
takeseem commented
- all package is up
pnpm up --latest - error:
Property 'items' does not exist on type 'never'.ts(2339) let root1androot2is temp resolved.
<script lang="ts">
interface NavItem {
id: string;
label: string;
url: string;
children?: NavItem[];
}
export interface Nav {
id: string;
siteId: string;
items: NavItem[];
}
let nav: Nav | null = $state(null);
let root: NavItem = $derived(( {
id: '_root_',
label: '',
url: '',
children: nav?.items,
} ));
let root1: NavItem = $derived({
id: '_root_',
label: '',
url: '',
children: (nav as Nav | null)?.items,
});
let root2: NavItem = $derived.by(() => ({
id: '_root_',
label: '',
url: '',
children: nav?.items,
}));
</script>7nik commented
This is a limitation we can do nothing with - for TS $derived is a regular function, and it sees that nav right now is null and concludes it is impossible that nav has .items.
The solution is to use $derived.by instead, as you do in root2, where due to nav being in a closure, it may be both Nav and null.