-
-
Notifications
You must be signed in to change notification settings - Fork 8.9k
Open
vuejs/language-tools
#4902Labels
Description
Vue version
3.4.37
Link to minimal reproduction
https://gist.github.com/tiredenzo/959827c17edd71eed099abdb2f03028d
Steps to reproduce
Description
There appears to be a TypeScript type inference issue when using v-for with ComputedRef in Vue 3. In certain cases, TypeScript incorrectly infers the type of the computed property used within the v-for loop, causing it to include true or other incorrect types in the inferred union.
This results in TypeScript errors like:
Property 'key' does not exist on type 'true | KeyValue[] | ComputedRefImpl<any>'.
Property 'key' does not exist on type 'true'.ts-plugin(2339)
What is expected?
to work 🤘 (render the option)
What is actually happening?
src/components/Test.vue:38:62 - error TS2339: Property 'key' does not exist on type 'true | ComputedRefImpl<any> | KeyValue[]'.
Property 'key' does not exist on type 'true'.
38 <option v-for="option in element.options" :key="option.key" :value="option.key">
~~~
src/components/Test.vue:38:82 - error TS2339: Property 'key' does not exist on type 'true | ComputedRefImpl<any> | KeyValue[]'.
Property 'key' does not exist on type 'true'.
38 <option v-for="option in element.options" :key="option.key" :value="option.key">
~~~
src/components/Test.vue:39:19 - error TS2551: Property 'value' does not exist on type 'true | ComputedRefImpl<any> | KeyValue[]'. Did you mean 'valueOf'?
Property 'value' does not exist on type 'true'.
39 {{ option.value }}
~~~~~
System Info
System:
OS: Linux 6.6 Debian GNU/Linux 12 (bookworm) 12 (bookworm)
CPU: (10) arm64 unknown
Memory: 15.80 GB / 17.54 GB
Container: Yes
Shell: 5.2.15 - /bin/bash
Binaries:
Node: 21.3.0 - /usr/local/bin/node
Yarn: 1.22.19 - /usr/local/bin/yarn
npm: 10.8.3 - /home/app/node_modules/.bin/npm
npmPackages:
vue: ^3.4.37 => 3.5.10
### Any additional comments?
_No response_