Vue中Select标签会导致Value值转换为字符串
在Vue中,当使用<select>标签并为value绑定一个可选型(例如number|string)时,可能会遇到value值被转换为字符串的问题。
这是因为Vue会优先保持与HTML的兼容性,而DOM中的属性默认都是字符串类型。因此,通过event.target.value获取到的值也被强制转换为字符串。
为了解决此问题,可以使用v-model结合自定义的modelValue属性:
<select v-model="modelValueRef"> <option v-for="(item, index) in enumStrsList" :key="index" :value="item[1]"> {{ item[0] }} </option> </select>
此处,modelValueRef是一个响应式Ref对象,它可以保存number或string类型的值。通过v-model绑定,select的value将动态更新modelValueRef的值,并保持正确的类型。