第一种

传递一个数组

props:["cont"]

第二种

传递一个对象

props:{
uploadOption:{
type:Object, 参数类型必须是一个对象
required: true 这一种说明这个参数是必须的哈
}
}

其他的用法

基础的类型检查 (nullundefined 会通过任何类型验证)

 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的使用的更多相关文章

  1. vue小故事之父子(上下级)通信之父传子props

    vue小故事之父子(上下级)通信之父传子props vue 父子(上下级)通信 props  或许你对父子通信有点迷糊,为什么这样那样父子之间就可以通信了,以下通过一个小故事来进行解说,故事模型或许有 ...

  2. vue传值 ---- >> 父传子,props()

    父组件:     1 <template> 2     <div class="comment"> 3         <div>comment ...

  3. 深度剖析Vue中父给子、子给父、兄弟之间传值!

    本片文章将为您详细讲解在Vue中,父给子传值.子给父传值以及兄弟之间传值方式! 父传子:父组件 // template里面 <aa :info="name"/> // ...

  4. vue中父组件使用props或者$attras向子组件中传值

    知识点:vue中使用props或者$attras向子组件中传值 (1) props传值 子组件必须注册好要传的数据() props:['id'] (2)$attrs传值 该数据在props中,没有注册 ...

  5. 总结vue中父向子,子向父以及兄弟之间通信的几种方式

    子向父方式1:通过props,如例子中子组件test1.vue向父组件App.vue传值 App.vue代码 <template> <div id="app"&g ...

  6. vue 组件之间相互传值 父传子 子传父

    1.父传子 把要传入的值放到父标签里  子组件使用props接收 父写法 子写法 2.子传父 子组件: childrenOnclick() { // 发布自定义事件 this.$emit(" ...

  7. Vue中父组件向子组件传值

    Vue中父组件向子组件传值 相关Html: <!DOCTYPE html> <html lang="en"> <head> <meta c ...

  8. Vue ---- 组价 组件化 子传父 父传子

    目录 补充js的for循环: 组件 1.组件的分类: 2.组件的特点 3.创建局部组件 4.全局组件 二.组件化 一.组件传参父传子 二.组件传参:子传父 补充js的for循环: // for in遍 ...

  9. vue 评论 computed watch 分隔符 局部组件 全局组件 子传父消息|父传子消息

    评论案例 splice: (start 几位,替换(新增)内容) splice(0,0,内容)在头部插入内容 splice(0,1) 把索引为0的往后删除1位  splice(0,1,内容)把索引为0 ...

  10. vue的组件通讯 父传子 -- 子传父-- 兄弟组件的传值 vue的组件传值

    首先文字简单撸一下 父子传子   -------首先在父组件上绑定一个属性,在子组件里用props接收,可以是数组或者是对象 子传父   ------在父组件升上自定义一个方法,在子组件里通过this ...

随机推荐

  1. 在探索的道路上持续“做对”,火山引擎A/B测试成为这家企业数字基建

    更多技术交流.求职机会,欢迎关注字节跳动数据平台微信公众号,回复[1]进入官方交流群   最近,乐刻的"百城万店"战略在行业激起了许多讨论.在传统健身馆经营承压.服务业难标准化的语 ...

  2. 机器学习周刊 第4期:动手实战人工智能、计算机科学热门论文、免费的基于ChatGPT API的安卓端语音助手、每日数学、检索增强 (RAG) 生成技术综述

    LLM开发者必读论文:检索增强(RAG)生成技术综述! 目录: 1.动手实战人工智能 Hands-on Al 2.huggingface的NLP.深度强化学习.语音课 3.Awesome Jupyte ...

  3. Jetpack初步了解

    1.为何要引入Jetpack呢? 通常来说,一个Android应用程序至少需要一个Activity,当我们开发小型Android程序时,可能会将大部分代码写在Activity/Fragment中,例如 ...

  4. 机器学习 | 分类性能度量指标 : ROC曲线、AUC值、正确率、召回率

    本篇博客的图源来自 zhwhong,转载仅作学习使用! 在分类任务中,人们总是喜欢基于错误率来衡量分类器任务的成功程度.错误率指的是在所有测试样例中错分的样例比例.实际上,这样的度量错误掩盖了样例如何 ...

  5. Codeforces 1326A Bad Ugly Numbers (思维)

    Codeforces 1326A Bad Ugly Numbers 看完题目,第一直觉,质数肯定满足题意,再看数据范畴,\(1≤n≤10^5\), 质数线性筛仅能做到 n=7 的情况,即处理到1000 ...

  6. AtCoder Beginner Contest 187 题解

    A - Large Digits 按要求求出两个数的每位之和,进行比较即可. 时间复杂度 \(\mathcal{O}(\log(AB))\). B - Gentle Pairs 枚举所有点对求斜率. ...

  7. 活动回顾|阿里云 Serverless 技术实战与创新上海站回放&PPT下载

    5月27日"阿里云 Serverless 技术实战与创新"上海站圆满落幕.活动现场邀请了来自阿里云 一线技术专家,分享当前 Serverless 趋势和落地实践过程中的挑战和机遇: ...

  8. Asp .Net Core 系列:集成 Ocelot+Nacos+Swagger+Cors实现网关、服务注册、服务发现

    目录 简介 什么是 Ocelot ? 什么是 Nacos ? 什么是 Swagger ? 什么是 Cors ? Asp .Net Core 集成 Ocelot 网关集成 Nacos 下游配置 Naco ...

  9. 【调试】kprobes(二)使用方法

    前言 上一节介绍了kprobe的基本概念,下面我们将使用几个具体的例子,看下kprobe在实际使用中有那些应用场景. kprobe 内核的samples/kprobe目录下有kprobe相关的例子,我 ...

  10. SpringBoot 集成短信和邮件

    准备工作 1.集成邮件 以QQ邮箱为例 在发送邮件之前,要开启POP3和SMTP协议,需要获得邮件服务器的授权码,获取授权码: 1.设置>账户 在账户的下面有一个开启SMTP协议的开关并进行密码 ...