为什么vue< select v-model=“number | string”>两者都能工作?

qjp7pelc  于 2021-09-23  发布在  Java
关注(0)|答案(1)|浏览(379)

请看这个最小的例子

new Vue({
  el: '#app',
  data() {
    return {
      valueIsString: '1',
      valueIsNumber: 1,
    }
  },
  template: `
    <div>
      <select v-model="valueIsString">
        <option value="0">0</option>
        <option value="1">1</option>
      </select>

      <select v-model="valueIsNumber">
        <option value="0">0</option>
        <option value="1">1</option>
      </select>
    </div>
  `
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>

<div id="app"></div>

我有两种不同的选择 <select> ,一个是有约束力的 string ,另一个是绑定到 number .
他们都工作,为什么会这样?
为什么vue知道将我的号码Map到字符串?

vkc1a9a2

vkc1a9a21#

这应该是使用javascript的结果。如果你没有准确地声明类型,js会给你很多帮助。
因此,如果您知道希望输入类型为整数,只需添加一个 .number v型模型后的修改器:

<select v-model.number="valueIsNumber">

你可以在这里学到更多

相关问题