Vue.js [Vue 警告]：无效的props：propsscrollThreshold的类型判断失败.期望的数字，得到字符串

发布于11月27日

我的应用程序中不断出现这个错误.vue工具栏.

[Vue warn]:无效的属性:属性"scrollThreshold"的类型判断失败&gt；预期数字，获得字符串.

<v-toolbar 
  dark color="pink darken-4" 
  class="toolbar"
  flat 
  fixed
  scroll-off-screen
  scroll-threshold=500>
</v-toolbar>

我把scrollThreshold改为"500"，错误是一样的.

推荐答案

使用v-bind或:速记输入非字符串值，如下所示:

<v-toolbar  
  :scroll-threshold="777">
</v-toolbar>

如果为属性传入一个静态值，如下所示:

<v-toolbar  
  color="pink" 
  class="toolbar"
  flat 
  scroll-threshold="777">
</v-toolbar>

它总是被解析为一个字符串，并将编译成如下内容:

_c("v-toolbar", {
  staticClass: "toolbar",
  attrs: {
    color: "pink",
    flat: "",
    "scroll-threshold": "777"
  }
}),

相反，可以使用v-bind shorthand syntax来传递JavaScript表达式.通常，当您想要解析模型上可用的属性时，这是有意义的，但它实际上只是将外部引号中的任何内容作为常规js进行计算.

因此，如果更新为使用:scroll-threshold="777"，777将被判断为如下数字:

_c("v-toolbar", {
  staticClass: "toolbar",
  attrs: {
    color: "pink",
    flat: "",
    "scroll-threshold": 777
  }
}),

实用课程推荐