vue中父传子props的使用
第一种
传递一个数组
props:["cont"]
第二种
传递一个对象
props:{
uploadOption:{
type:Object, 参数类型必须是一个对象
required: true 这一种说明这个参数是必须的哈
}
}
其他的用法
基础的类型检查 (null 和 undefined 会通过任何类型验证)
props: {
propA: Number, //如果不符合类型 控制台会警告
// 多个可能的类型
propB: [String, Number],
// 必填的字符串
propC: {
type: String,
required: true //必填
},
// 带有默认值的数字 propD是一个数字,如果没有值,默认是100
propD: {
type: Number,
default: 100
},
// 带有默认值的对象
propE: {
type: Object,
// 对象或数组默认值必须从一个工厂函数获取
default: function () {
return { message: 'hello' }
}
},
// 自定义验证函数
propF: {
validator: function (value) {
// 这个值必须匹配下列字符串中的一个
return ['success', 'warning', 'danger'].indexOf(value) !== -1
}
}
vue中父传子props的使用的更多相关文章
- vue小故事之父子(上下级)通信之父传子props
vue小故事之父子(上下级)通信之父传子props vue 父子(上下级)通信 props 或许你对父子通信有点迷糊,为什么这样那样父子之间就可以通信了,以下通过一个小故事来进行解说,故事模型或许有 ...
- vue传值 ---- >> 父传子,props()
父组件: 1 <template> 2 <div class="comment"> 3 <div>comment ...
- 深度剖析Vue中父给子、子给父、兄弟之间传值!
本片文章将为您详细讲解在Vue中,父给子传值.子给父传值以及兄弟之间传值方式! 父传子:父组件 // template里面 <aa :info="name"/> // ...
- vue中父组件使用props或者$attras向子组件中传值
知识点:vue中使用props或者$attras向子组件中传值 (1) props传值 子组件必须注册好要传的数据() props:['id'] (2)$attrs传值 该数据在props中,没有注册 ...
- 总结vue中父向子,子向父以及兄弟之间通信的几种方式
子向父方式1:通过props,如例子中子组件test1.vue向父组件App.vue传值 App.vue代码 <template> <div id="app"&g ...
- vue 组件之间相互传值 父传子 子传父
1.父传子 把要传入的值放到父标签里 子组件使用props接收 父写法 子写法 2.子传父 子组件: childrenOnclick() { // 发布自定义事件 this.$emit(" ...
- Vue中父组件向子组件传值
Vue中父组件向子组件传值 相关Html: <!DOCTYPE html> <html lang="en"> <head> <meta c ...
- Vue ---- 组价 组件化 子传父 父传子
目录 补充js的for循环: 组件 1.组件的分类: 2.组件的特点 3.创建局部组件 4.全局组件 二.组件化 一.组件传参父传子 二.组件传参:子传父 补充js的for循环: // for in遍 ...
- vue 评论 computed watch 分隔符 局部组件 全局组件 子传父消息|父传子消息
评论案例 splice: (start 几位,替换(新增)内容) splice(0,0,内容)在头部插入内容 splice(0,1) 把索引为0的往后删除1位 splice(0,1,内容)把索引为0 ...
- vue的组件通讯 父传子 -- 子传父-- 兄弟组件的传值 vue的组件传值
首先文字简单撸一下 父子传子 -------首先在父组件上绑定一个属性,在子组件里用props接收,可以是数组或者是对象 子传父 ------在父组件升上自定义一个方法,在子组件里通过this ...
随机推荐
- 斗罗大陆真3D手游实力上线,带你感受魂兽猎杀的超燃时刻
摘要:在华为云数据库支撑该游戏的仅两个月内就完成了游戏内测至上线的全流程,业务上线流程缩短50%,并支撑海量游戏用户同时在线,达到了200万的用户预约量,上线首日流水破1000万. "没有废 ...
- vue2升级vue3:provide与inject 使用注意事项
provide / inject 类似于消息的订阅和发布.provide 提供或发送数据, inject 接收数据. VUE provide 和 inject 使用场景 当我们需要从父组件向子组件传递 ...
- Hugging News #0506: StarCoder, DeepFloyd/IF 好多新的重量级模型
每一周,我们的同事都会向社区的成员们发布一些关于 Hugging Face 相关的更新,包括我们的产品和平台更新.社区活动.学习资源和内容更新.开源库和模型更新等,我们将其称之为「Hugging Ne ...
- LLVM 参考链接
https://www.llvm.org/ LLVM Essentials(Paperback) LLVM 编译器 https://www.cs.cmu.edu/afs/cs.cmu.edu/acad ...
- CF(codeforces)如何保持紫名及以上?
虽然我还是连绿名都没,但还是想学习大牛们的学习方法,加油尽早上分. 转自知乎 之前在 CF 上看到一条不错的评论 https://codeforces.com/blog/entry/66715?#co ...
- 使用acme.sh、acme-dns自动申请ssl证书
使用acme.acme-dns实现自动申请ssl证书并实现自动替换 有些dns没有dnsapi,所以用这种方式申请只需要添加一条dns解析即可完成 以下为linux系统操作 安装acme.sh 官方源 ...
- keepalived如何手动切换主备
概述 主备部署中使用keepalived可以很方便的实现,安装维护简单,功能稳定. 最近在使用过程中有小的发现,记录一下. 环境 CentOS Linux release 7.9.2009 (Core ...
- 腾讯视频客户端 MP4 下载
腾讯视频直接使用客户端下载视频,得到的是 QLV 文件,这种加密视频文件只能通过腾讯视频客户端播放.最新版的腾讯客户端下载的 QLV 文件,使用各种转码软件都不能正常转码.从服务器下载的 TS 文件一 ...
- ElasticSearch使用实践(文档操作)
可以使用Docker安装ES和Kibana: 使用docker-compose安装ElasticSearch和Kibana: version: '3.1' services: elasticsearc ...
- 【解决方案】如何使用 Http API 代替 OpenFeign 进行远程服务调用
目录 前言 一.何为OpenFeign 1.1@FeignClient注解 1.2注意事项 二.常见的Http API 2.1Apache 2.2Okhttp 2.3Hutool 三.RestTemp ...