Question

App.vue

<v-text-field v-model="daysNumber" type="number"></v-text-field>

<MyComponent :daysNumber="daysNumber"/>

  data: () => ({
    daysNumber: 5,

MyComponent.vue

props: {
    daysNumber: { type: Number, required: true }
  },

在我增加数字文本框中的数字un之前，所有方法都很有效：（从初始的'5'到'6'）：错误：

vue.runtime.esm.js？2b0e：619

[Vue警告]：道具无效：道具“ daysNumber”的类型检查失败。预期值为6，数字为String，值为“ 6”。

位于
---> <MyComponent> at src/components/MyComponent.vue
       <VContent>
         <VApp>
           <App> at src/App.vue
             <Root>

Answer 1

您需要在v-model上添加.number修饰符，否则输入的类型将是字符串。

<v-text-field v-model.number="daysNumber" type="number"></v-text-field>

Answer 2

Vue中有一个.number修饰符，可以将v-model转换为数字，因此可以使用：

<v-text-field v-model.number="daysNumber" type="number"></v-text-field>

参考： https://vuejs.org/v2/guide/forms.html#number

Answer 3

对于可能遇到此问题的其他人，我的问题有所不同。将 .number 添加到 v-model 导致了同样的错误。

我的 ID 字段有误。它正在使用字段名称

:id="dataModel.fieldname"

而不是正确的索引

:id="dataModel.index"

[Vue警告]：道具无效：道具“ xxx”的类型检查失败。预期值为X的数字，得到值为“ X”的字符串

3 个答案: