uni-app的父与子页面传递参数之属性Props字段类型讲解
Vue.component('myComponent', {
props: {
// 基础类型检测 (`null` 意思是任何类型都可以)
propA: Number,
// 多种类型
propB: [String, Number],
// 必传且是字符串
propC: {
type: String,
required: true
},
// 数字,有默认值
propD: {
type: Number,
default: 100
},
// 数组/对象的默认值应当由一个工厂函数返回
propE: {
type: Object,
default: function () {
return { message: 'hello' }
}
},
// 自定义验证函数
propF: {
validator: function (value) {
return value > 10
}
}
}
})
type 可以是下面原生构造器:
String
Number
Boolean
Function
Object
Array
Symbol
type 也可以是一个自定义构造器函数,使用 instanceof 检测。
// 自定义Person构造器
function Person(name, age) {
this.name = name
this.age = age
}
Vue.component('my-component', {
template: `<div>名字: {{ person-prop.name }}, 年龄: {{ person-prop.age }} </div>`,
props: {
person-prop: {
type: Person // 指定类型
}
}
})
new Vue({
el: '#app2',
data: {
person: 2 // 传入Number类型会报错
}
})
- 相关阅读
- 汽配公司
- 百度蜘蛛饲养技巧
- 连云港五洲旅行社有限公司
- 一个非常不错的程序编辑工具--PSPad editor
- 购买系统多久可以安装?
- 深山行者留言系统V2.3
- 四川省旅者旅行社有限公司总部
- 深山网吧留言板(激情穿越火线)v4.3
- 共有0条关于《uni-app的父与子页面传递参数之属性Props字段类型讲解》的评论
- 发表评论
您发布的评论即表示同意遵守以下条款:
一、不得利用本站危害国家安全、泄露国家秘密,不得侵犯国家、社会、集体和公民的合法权益;
二、不得发布国家法律、法规明令禁止的内容;互相尊重,对自己在本站的言论和行为负责;
三、本站对您所发布内容拥有处置权。
- 更多>>同类信息
- uni-app开发表单input组件的一些规则说明自己预留使用
- uni-app:使用uni.downloadFile下载word或pdf文件并保存到手机
- 小程序中利用addPhoneContact将联系人的信息添加到手机通讯录支持保存联系人头像
- 微信小程序打开客服提示:该小程序提供的服务出现故障,请稍后重试
- 微信小程序客服会话只能过button让用户主动触发
- uni-app开发微信小程序使用button的open-type为contact调用微信客服不能用view或者js调用