[Question] When using jsx, I have a few doubts

[hairyf]

🧐 Problem Description

I encountered some problems when using v-model, such as using it in template.

<input v-model:xxx="refVal" />

I checked the relevant information and found that it is actually used in jsx like this

<input v-model={[refVal.value, ['xxx']]} />

Well, if it is impossible to achieve a form similar to v-model:xxx, I can understand
But why, why is my xxx that is v-model:[xxx] placed after the array.

<input v-model={[refVal.value, ['xxx']]} />
<input v-models={[[refVal.value, ['xxx']], [refVal.value, ['bbb']]]} />

Instead of this

<input v-model={['xxx', refVal.value]} />
<input v-models={[['xxx', refVal.value], ['bbb', refVal.value]]} />

Or like this

<input v-model={{xxx: refVal.value}} />
<input v-models={[{xxx: refVal.value}, {bbb: refVal.value}]} />

Well, I just don't adapt to this grammar, it makes me feel very messy, or a bit, I want to know what caused it. 🤔

[KaelWD]

if it is impossible to achieve a form similar to v-model:xxx

Typescript didn't support this until ts 4.2. Vue 3.2 now requires typescript 4.1 so I don't think it's unreasonable to require 4.2 for jsx.

why is my xxx that is v-model:[xxx] placed after the array

This is the same order as vue's withDirectives: https://github.com/vuejs/vue-next/blob/2937530beff5c6bb57286c2556307859e37aa809/packages/compiler-core/src/ast.ts#L426

---

Duplicate of #325 I guess