vue属性props默认类型怎么写

这篇“vue属性props默认类型怎么写”文章的知识点大部分人都不太理解，所以小编给大家总结了以下内容，内容详细，步骤清晰，具有一定的借鉴价值，希望大家阅读完这篇文章能有所收获，下面我们一起来看看这篇“vue属性props默认类型怎么写”文章吧。

vue属性props默认类型

Vue.component('my-component', {  props: {    // 基础的类型检查 (`null` 匹配任何类型)    //单个类型    propA: Number,    // 多个可能的类型    propB: [String, Number],    // 必填的字符串    propC: {      type: String,      required: true    },    //函数    propC: {      type:Function,      required: true    },    // 带有默认值的数字    propD: {      type: Number,      default: 100    },    //多个可能类型带默认值     propE: {      type:  [String, Number],      default: 100    },    // 带有默认值的对象    propF: {      type: Object,      // 对象或数组且一定会从一个工厂函数返回默认值      default: function () {        return { message: 'hello' }      }    },    // 自定义验证函数    propG: {      validator: function (value) {        // 这个值必须匹配下列字符串中的一个        return ['success', 'warning', 'danger'].indexOf(value) !== -1      }    }  }})

props自定义属性

这是一个自定义属性，在封装通用组件的时候，合理地使用props可以极大的提高组件的复用性

语法：可以定义为数组类型的：

export default {    props:['init']}

也可以定义为对象类型：

export default {  // props 是"自定义属性"，允许使用者通过自定义属性，为当前组件指定初始值  // 自定义属性的名字，是封装者自定义的（只要名称合法即可）  // props 中的数据，可以直接在模板结构中被使用  // 注意：props 是只读的，不要直接修改 props 的值，否则终端会报错！  // props: ['init'],  props: {    // 自定义属性A : {  },    // 自定义属性B : {  },    // 自定义属性C : {  },    init: {      // 如果外界使用 Count 组件的时候，没有传递 init 属性，则默认值生效      default: 0,      // init 的值类型必须是 Number 数字      type: Number,      // 必填项校验      required: true    }  },}

注意：数组类型是没有default属性的，只有定义为对象类型才存在 

以上就是关于“vue属性props默认类型怎么写”这篇文章的内容，相信大家都有了一定的了解，希望小编分享的内容对大家有帮助，若想了解更多相关的知识内容，请关注编程网行业资讯频道。