第一种

传递一个数组

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. 4种Springboot RestTemplate 服务里发送HTTP请求用法

    摘要: RestTemplate与REST资源交互的方法涵盖了HTTP请求方法,包括get, post, put, delete. 本文分享自华为云社区<Springboot RestTempl ...

  2. 应用开发专家一席谈:开发低代码,上手低门槛,AppCube使能Citizen Developer,人人都是开发者

    摘要:让不确定因子变为确定性因子,把复杂留给平台,简单留给开发者,是软件开发效率改进一直努力的方向,也是低代码理念的来源. 本文分享自华为云社区<应用开发专家一席谈:开发低代码,上手低门槛,Ap ...

  3. Java 17 从 Solon 开始入手,v1.10.0

    相对于 Spring Boot 和 Spring Cloud 的项目: 启动快 5 - 10 倍. (更快) qps 高 2- 3 倍. (更高) 运行时内存节省 1/3 ~ 1/2. (更少) 打包 ...

  4. 在低代码开发平台 ILLA Cloud 中使用 Hugging Face 上的模型

    ILLA Cloud 是一个面向开发者的开源低代码开发平台,平台专注于帮助开发者快速建立企业内部应用,为开发者节约数据调用与页面设计的时间.平台具有面向开发者.数据整合.协同开发.灵活部署等功能与特点 ...

  5. POJ 1011 Sticks​ (DFS + 剪枝)

    题目地址:http://poj.org/problem?id=1011 题目大意 给出n个小木棒,组合成若干长度最短棍子 解题思路 首先将木棒从大到小排序 dfs(k, l), k是还剩多少木棒没用, ...

  6. Liunx常用操作(十)-VI编辑器-命令模式命令

    vI编辑器三种模式 分别为命令模式.输入模式.末行模式.

  7. Rocketmq学习3——消息发送原理源码浅析

    一丶概述 RocketMQ 消息发送的原理流程可以分为以下几个步骤: 1. 创建生产者 在发送消息前,客户端首先需要创建一个消息生产者(Producer)实例,并设置必要的配置参数,如NameServ ...

  8. Vue之将前端的筛选结果导出为csv文件

    有导入就有导出哈!这里继导入之后记录一下导出的实现过程. 1.按钮部分: <el-button class="filter-item" style="margin- ...

  9. python3使用json、pickle和sqlite3持久化存储字典对象

    技术背景 在各种python的项目中,我们时常要持久化的在系统中存储各式各样的python的数据结构,常用的比如字典等.尤其是在云服务类型中的python项目中,要持久化或者临时的在缓存中储存一些用户 ...

  10. 274. H 指数

    1.题目介绍 给你一个整数数组 citations ,其中 citations[i] 表示研究者的第 i 篇论文被引用的次数.计算并返回该研究者的 h 指数. 根据维基百科上 h 指数的定义:h 代表 ...