VueJS 使用带有 NULL 和“未定义”值的 Prop 类型验证？

Question

即使VueJS 2 官方文档中关于 prop 验证的说明（作为代码示例的注释行）：

// 基本类型检查（null并且undefined值将通过任何类型验证）

我在复制此代码时遇到以下错误- 为什么会这样？

[Vue warn]: Invalid prop: type check failed for prop "value". Expected String, Number, Boolean, got Null 

[Vue warn]: Invalid prop: type check failed for prop "value". Expected String, Number, Boolean, got Null 

Answer 1

// 基本类型检查（null并且undefined值将通过任何类型验证）

这仅在required: true未设置时适用。在您的代码中，您说需要道具，因此 Vuejs 显示警告

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

Answer 2

PropType与Vue3

<script lang="ts">

import { defineComponent, PropType } from 'vue'

export default defineComponent({
  components: {
  ...
  },
  name: 'Component',

  props: {
    value: { 
      type: null as unknown as PropType<string | null>,
      default: null, required: false
    }
  }
})

Answer 3

这是因为 required: true

来自API 文档（更多详细信息）

required: Boolean 定义是否需要道具。在非生产环境中，如果此值为真且未传递 prop，则会抛出控制台警告。