props配置项
功能:让组件接收外部传过来的数据

传递数据:<Demo name="xxx"/>

接收数据:

第一种方式(只接收):props:['name']

第二种方式(限制类型):props:{name:String}

第三种方式(限制类型、限制必要性、指定默认值):

props:{name:{type:String, //类型required:true, //必要性default:'老王' //默认值}
}

备注:props是只读的,Vue底层会监测你对props的修改,如果进行了修改,就会发出警告,若业务需求确实需要修改,那么请复制props的内容到data中一份,然后去修改data中的数据。

ue中prop传值时加不加v-bind(冒号:):

只有传递字符串常量时,不采用v-bind形式,其余情况均采用v-bind形式传递。

原文链接:https://blog.csdn.net/weixin_45237107/article/details/123410689

vue中prop传值相关推荐

  1. Vue 中 props 传值,父组件向子组件传递对象/数组可以直接修改的问题

    vue 中父子组件通信最常用的方式是 props 和 $emit,所有的 prop 都使得其父子 prop 之间形成了一个单向下行绑定:父级 prop 的更新会向下流动到子组件中,但是反过来则不行.这 ...

  2. vue中prop的用法

    prop的大小写 HTML 中的 attribute 名是大小写不敏感的,所以浏览器会把所有大写字符解释为小写字符.这意味着当你使用 DOM 中的模板时,camelCase(驼峰命名法)的 prop ...

  3. vue中prop验证、类型检查及注意事项

    1.注意:null和undefined会通过任何类型检测 2.数组或对象类型需要提供默认值的话需要通过函数返回.详情看这里 props:{// 数组或对象的默认值需要通过函数返回authInfo:{t ...

  4. vue中props传值给data时-props有值但data却是空的问题

    问题 设计vue组件时,常常有这样一个应用场景:父组件通过接口请求回来的数据传给子组件, 然后在子组件内部我们会用一个props来接收,并且将该props赋值给data里面的一个变量(便于我们后期对这 ...

  5. vue打印props的值_vue中props传值方法

    vue中props传值方法 1.开发环境 vue 2.电脑系统 windows10专业版 3.在使用 vue开发的过程中,我们经常会使用 props进行组件的传值,下面是我的分享,希望对你有所帮助! ...

  6. mixin机制 vue_谈谈vue中mixin的一点理解

    谈谈vue中mixin的一点理解 vue中提供了一种混合机制--mixins,用来更高效的实现组件内容的复用.最开始我一度认为这个和组件好像没啥区别..后来发现错了.下面我们来看看mixins和普通情 ...

  7. vue中传值和传引用_vue prop属性传值与传引用示例

    vue prop属性传值与传引用示例 vue组件在prop里根据type决定传值还是传引用. 简要如下: 传值:String.Number.Boolean 传引用:Array.Object 若想将数组 ...

  8. vue中组件之间传值的六种方式(完整版)

    前言   组件是 vue.js 最强大的功能之一,而组件实例的作用域是相互独立的,这就意味着不同组件之间的数据无法相互引用.一般来说,组件可以有以下几种关系: 如上图所示,A 和 B.B 和 C.B ...

  9. Vue中父子组件传值的多种方式

    vue中父子组件传值 vue中的父子组件传值,值得注意的是要遵守单向数据流原则.所谓单向数据流原则,简单的说就是父组件的数据可以传递给子组件,子组件也可以正常获取并使用由父组件传过来的数据:但是,子组 ...

最新文章

  1. Java Comparator排序
  2. 攻防世界-Misc-What-is-this(简单易懂)
  3. 十九、Pytorch中的数据加载
  4. thinkphp5中使用workerman
  5. HTML转义字符大全<转>
  6. VC2010 项目的创建
  7. cachestat、cachetop、pcstat-linux系统缓存命中率分析工具
  8. 前端基础:vue.js跟node.js分别是什么
  9. Mono喜迁新家-http://www.xamarin.com/
  10. 推荐系统(Recommendation system )
  11. Android下的默认字体详解
  12. 中国上市公司2001-2020年历史股票数据下载(获得方式见网页 http://yanzw.cn )
  13. 使用el-tree-transfer不显示label的坑
  14. win10不能正常安装.NET Framework 3.5,报0x800F081F错误。
  15. 新版标准日本语中级_第二十一课
  16. windows debug tools
  17. 前端学习总结,经验分享,项目经验分享过程
  18. 怎么给win10电脑设置每个月16号定时提醒
  19. 北京公务员计算机试题,北京公务员补录一级计算机练习题计算机一级计算机基础及+MS+Office应用(选择题)模拟试卷190:钢铁是怎样炼成的读后感...
  20. C语言volatile类型限定符详解

热门文章

  1. javascript的有限状态机
  2. 站长必备工具-网站添加微信/支付宝打赏功能,任意网站通用无须插件
  3. Joint Embedding of Words and Labels for Text Classification(ACL 2018)
  4. 计算机专业应届研究生面试自我介绍,计算机专业研究生面试英文自我介绍
  5. 论文快读:DETReg(CVPR2022)
  6. 【国产化】银河麒麟V10 aarch64 + TiDB国产化环境下安装EduSoho
  7. xboxone硬盘坏的表现_买硬盘不求人!看这两个网站,选到最稳的机械硬盘
  8. 高效管理Linux的两大法宝——定时与延时任务
  9. 新房装修材料避坑分享
  10. 基本的全局阈值处理Otsu方法进行最佳全局阈值处理