updated typing of key in VNodeProps (fix #4240)

[AlexandraCaragata]

Issue

#4240

Version

3.2.0-beta.7

Reproduction link

Reproduction link

Steps to reproduce

1. Use symbols as :key in a v-for.
2. Compile component incl. template with TypeScript (vue-tsc --noEmit)

What was expected?

Vue allows using a symbol as a v-for :key. This is very useful in some situations, since symbols are an automatically unique primitive. I would expect the typing of v-for :key to include symbol.

What was actually happening?

The code works at runtime, but the type checking step complains that the provided v-for :key is not string | number | undefined.

What is the fix doing?

Added type support for symbol for a v-for :key.

---

Symbols have been officially supported as a v-for :key since Vue 2.5. For some reason, the typing (but not the functionality) regressed with Vue 3.0.

We noticed this bug after switching from Vue-cli to Vite, since Vite supports TypeScript in templates out-of-the-box.

[posva]

I don't remember the reason for symbol not being supported before and I couldn't find any old issue or PR. I would say this is worth adding.

[Shinigami92]

Seems you missed one place 🙁

https://github.com/vuejs/vue-next/blob/e42d7794cb3546eec89629ed1202433a91d96047/packages/runtime-dom/types/jsx.d.ts#L1308

Could we fix this also?