Environment

• Operating System: Linux
• Node Version: v20.19.5
• Nuxt Version: 3.19.2
• CLI Version: 3.28.0
• Nitro Version: 2.12.6
• Package Manager: [email protected]
• Builder: -
• User Config: css, app, modules, sanctum, echo, i18n, fileStorage, imports, vite, compatibilityDate, ssr
• Runtime Modules: @nuxt/[email protected], @nuxtjs/[email protected], [email protected], @vueuse/[email protected], [email protected], @nuxtjs/[email protected], [email protected]
• Build Modules: -

Is this bug related to Nuxt or Vue?

Nuxt

Package

v3.x

Version

3.3.4

Reproduction

https://codesandbox.io/p/sandbox/admiring-maria-w8g7j2

Description

I can't pass numbers to value-key, otherwise the v-model value will be an array of objects, and I need an array of IDs (that's why I specify value-key). And when selecting elements further, I'll get a mixed array of objects and IDs:

[ { "id": "10441", "name": "N-Joy community" }, { "id": "10591", "name": "Karaoke Room" }, 10441 ]

And I'll get an error: [Vue warn]: Invalid prop: type check failed for prop "value". Expected String | Object, got Number with value 10441.

It's very inconvenient to cast IDs to strings every time, which requires writing extra code. Especially considering that in 90% of cases, the value-key will be an id (integer).