Subscribe on changes!

v-for type is unknown

avatar
Jan 4th 2023

Vue version

3.2.25

Link to minimal reproduction

https://sfc.vuejs.org/#eNrtlsGK2zAQhl9lMBTvwsZOdunFdQKFwlLooYfeohwUW461a0tCmiQbgt+9I9lOk5beStmDk4M9M9I/v0Y+fOfoszHJYS+iLMpdYaVBcAL3BhqudssYXbxiSrZGW4QzWFFBB5XVLcS0KWaKKfEWilKhsBUvBHx9tnpvfvDtF44czkwByDIDh1aq3ScfKt6Km8T6VZzGxCYDrk6U7rw6MFVo5RCM1cbBEkpRSSW++ygP2jvf7Zt0mN12Xm+8xuruPnQYZf6+mrTXfmUQ7S3Hi/ihj3rH8fMl4XQrsCa7C0rXoml0/EBNbkqPY8n//iw/hfLlT8ME6IL8tYXH3y140//fxtP7sDFNY5rGNI1pGtOlTJcyXco/sMHUxmNWnvbwR7BHAYrWNBwFRQB5KQ9QNNy5ZUwMhZzwy3oqJKjCfLtH1J7TKDjMKm2XLAqMRUD4C7ZY1HvpZViEfDvbogpphsy3DU8SNKvzGe56Ce5uIe0+8bOBrstT45369WnvoLeakld6y9OrE1Do8NT0h0kuJxhGX0pHCwk+q0a8BVIEOMoS6wwW8/mHkKEh0c7B87BvWPNxbsZdtZC7mrDyKrXlxas/iSpnhW60zQigy6E2JI61RDF2oVsITqOHqEfuWctN8uK0IjwPjdlQcCzKxq+HRYTiPmZRjWhclqauKjzUv7hE211Kb4ndK5StSIRrZ1urj05YEu7vhTp3UfcTW5jJNQ==

Steps to reproduce

The warning message doesn't show up on SFC Playground, but I get unknown type for group in v-for="group in groupList"

What is expected?

group should receive type IGroupTabData since it is iterating an array of IGroupTabData

What is actually happening?

I get unknown type for group in v-for="group in groupList"

System Info

System:
    OS: Linux 5.15 Ubuntu 22.04.1 LTS 22.04.1 LTS (Jammy Jellyfish)
    CPU: (8) x64 Intel(R) Core(TM) i7-9700 CPU @ 3.00GHz
    Memory: 5.97 GB / 15.45 GB
    Container: Yes
    Shell: 5.8.1 - /usr/bin/zsh
  Binaries:
    Node: 18.12.1 - ~/.nvm/versions/node/v18.12.1/bin/node
    npm: 9.2.0 - ~/.nvm/versions/node/v18.12.1/bin/npm
  Browsers:
    Chrome: 107.0.5304.121
  npmPackages:
    vue: ^3.2.25 => 3.2.41

Any additional comments?

I am using VS code for my IDE. I solved this issue by doing type casting but I want to know if there's a better solution for this.

<p>{{ (group as IGroupTabData).name }}</p>

I've also tried below but it did not work:

const props = defineProps({
  groupList: {
    type: Array as PropType<IGroupTabData[]>,
    default: []
  }
});
avatar
Jan 4th 2023

This project I am working on did not had tsconfig.json. After creating one with basic options, the issue was gone.