父子组件传递参数,使用props
父子组件通讯 - 锐客网 父子传参,用props ,传值:
-
{{item}}
{{cmsg}}
【vue|vue父子组件传参使用props】总结下:
验证类型:
支持的类型:String,Number,BOOlean,Array,Symbol,Object,Function,Date
// 基础类型检查('null'匹配任何类型)
propA: Number,
// 多个可能得类型
propB: [Number, String],
// 必填的字符串
propC: {
type: String,
required: true
},
// 有默认值的数字
propD: {
type: Number,
default: 112
},
// 有默认值的帝乡:
propE: {
type: Object,
default: function () {
// 对象或数组默认值必须从一个工厂函数中获取
return {
msg: 'hello'
}
}
},
// 自定义验证函数
propF: {
validator: function (value) {
//这个值必须匹配下列字符串中的一个
return ['success', 'warning', 'danger'].indexOf(value) !== -1
}
},
//如果有自定义构造函数,也支持验证自定义类型
function Person(firstName, lastName) {
this.firstName = firstName;
this.lastName = lastName;
}
Vue.component('diyType', {
props: {
author: Person
}
})
推荐阅读
- vue|前端学习笔记 webpack及命令文件结构
- Vue|Browserslist: caniuse-lite is outdated. Please run: npx ....
- Vue|解决 This is probably not a problem with npm. There is likely additional logging output above.
- Vue|Vue 创建项目后没有 webpack.config.js(vue.config.js) 文件
- java|Spring Boot + Vue 如此强大(你可能想不到的功能!)
- vue|vue项目 element UI 版本升级过程遇到的问题及解决办法
- Vue学习记录|Vue3.0 使用 ts 给 props 传入泛型
- 使用Vuex实现集中式存储管理应用的所有组件的状态
- JAVA后端|Java日期处理