Posted at

[Vue] 入力時に整数型に変換する input コンポーネントの作り方


成功例サンプル

https://codepen.io/mentol310/pen/jJxPyb



  • v-model を分離して @input から変更すると成功

  • たぶん vue のライフサイクル的なのが関係してる


失敗例

まぁ動かないよね

<inputs v-model="inputs" />

...
...
computed: {
inputs: {
userId: {
set: (value) => {
this.$set(this.inputs, 'userId', Number(value))
},
get: () => {
return this.inputs.userId
}
},
},
}

いけるかなって ......

watch: {

inputs() {
for (k in this.inputs) {
this.inputs[k] = Number(this.inputs[k])
}
this.$emit('input', this.inputs)
}
}

多少、応用は効くかな ... と思いました

TypeScript とかならこの辺気にせずサクッといけるんでしょうか :thinking:

キニナル