尽管VueJS 2 official documentation about prop validation表示(作为代码示例的注释行):

//基本类型判断(nullundefined值将通过任何类型

I'm getting the following error with 100 — why is that?

[Vue warn]: Invalid prop: type check failed for prop "value". Expected String, Number, Boolean, got Null 
<template>
  <div>
    <h1>{{ title }}:</h1>
    <MyInput :value="null" />
  </div>
</template>

<script>
Vue.component('MyInput', Vue.extend({
  props: {
    value: {
      type: [String, Number, Boolean],
      required: true,
    },
  },
  template: `
    <select v-model="value">
      <option value="null">
        null value
      </option>
      <option value="">
        Empty value
      </option>
    </select>`,
}));

export default {
  data: () => ({
    title: 'VueJS Using Prop Type Validation With NULL and `undefined` Values?'
  }),
};
</script>

推荐答案

//基本类型判断(nullundefined个值将通过任何类型验证)

这仅适用于未设置required: true的情况.在你的代码中,你说props 是必需的,所以Vuejs显示了警告

相关讨论:https://forum.vuejs.org/t/shouldnt-null-be-accepted-as-prop-value-with-any-type/63887

Vue.js相关问答推荐

Vue 3:插槽属性 - 可以通过 props 传递数据吗?

Nuxt3: 安装vue3-spinner (error: require is not defined in ES module scope)

我如何使用 vuejs 在我的 url 中编码一个令牌

Vuetify 扩展面板,面板标题左侧带有图标

两个div元素之间的vue2过渡

如何对将 DOM 元素附加到 HTML 正文的 Vue 组件进行单元测试?

将 Vue 应用程序挂载到主 Vue 应用程序的容器中

Vue CLI - 编译后将配置文件保留为外部

如何在 vue 的 scss 中使用深度 Select 器

使用 vuex 更新数据

VueJs this.method 不是函数?如何在 Vuejs 的另一个方法中调用一个方法?

将 props 传递给 Vue 组件中的元素属性

Keycloak:用户基于角色的客户端登录访问限制

vue 3 使用 Vuex 和路由的服务器端渲染

Vue组件未在laravel 5.3中使用Passport 显示

如何在 VueJS 中下载本地存储的文件

如何在 Vue.js 中延迟 @keyup 处理程序

vue 未在实例上定义,但在渲染期间引用

单击 v-select 项目时如何获取对象而不是单个值?

理解 Vue 中的this关键字