VueJS使用带有NULL和'undefined'值的道具类型验证吗? [英] VueJS Using Prop Type Validation With NULL and 'undefined' Values?

问题描述

即使关于道具验证的VueJS 2官方文档是声明(作为代码示例的注释行):

Even though VueJS 2 official documentation about prop validation is stating (as a code example's comment line):

//基本类型检查( null 和 undefined 值将通过任何类型验证)

// Basic type check (null and undefined values will pass any type validation)

我在此代码复制时遇到以下错误-为什么?>

I'm getting the following error with this code reproduction — 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>

推荐答案

//基本类型检查( null 和 undefined 值将通过任何类型验证)

// Basic type check (null and undefined values will pass any type validation)

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

This applies only when required: true is NOT set. In your code, you are saying that the prop is required and so Vuejs is showing the warning

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

这篇关于VueJS使用带有NULL和'undefined'值的道具类型验证吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！