• 首页
  • css3教程
  • html5教程
  • jQuery手册
  • vue手册
  • php手册
  • MySQL手册
  • apache手册
  • redis手册
  • props

    • 类型:Array<string>| Object
    • 详细:props 可以是数组或对象,用于接收来自父组件的数据。

    props 可以是简单的数组,或者使用对象作为替代,对象允许配置高阶选项,如类型检测、自定义验证和设置默认值。你可以基于对象的语法使用以下选项:

    • type:可以是下列原生构造函数中的一种:StringNumberBooleanArrayObjectDateFunctionSymbol、任何自定义构造函数、或上述内容组成的数组。会检查一个 prop 是否是给定的类型,否则抛出警告。Prop 类型的更多信息在此。
    • defaultany为该 prop 指定一个默认值。如果该 prop 没有被传入,则换做用这个值。对象或数组的默认值必须从一个工厂函数返回
    • requiredBoolean义该 prop 是否是必填项。在非生产环境中,如果这个值为 truthy 且该 prop 没有被传入的,则一个控制台警告将会被抛出。
    • validatorFunction自定义验证函数会将该 prop 的值作为唯一的参数代入。在非生产环境下,如果该函数返回一个 falsy 的值(也就是验证失败),一个控制台警告将会被抛出。你可以在这里查阅更多 prop 验证的相关信息。


    const app = Vue.createApp({})
    
    // 简单语法
    app.component('props-demo-simple', {
    	props: ['size', 'myMessage']
    })
    
    // 对象语法,提供验证
    app.component('props-demo-advanced', {
    	props: {
    		// 类型检查
    		height: Number,
    		// 类型检查 + 其他验证
    		age: {
    			type: Number,
    			default: 0,
    			required: true,
    			validator: value => {
    				return value >= 0
    			}
    		}
    	}
    })
    

    上篇:data

    下篇:computed