文档章节

Vue.js学习系列(四十三)-- 使用props传递数据

博为峰教研组
 博为峰教研组
发布于 2017/04/05 19:09
字数 230
阅读 91
收藏 0

#程序员薪资揭榜#你做程序员几年了?月薪多少?发量还在么?>>>

组件实例的作用域是孤立的,这就意味着不能并且不应该在子组件模板内直接引用父组件的数据,

prop 是父组件用来传递数据的一个自定义属性。父组件的数据需要通过 props 把数据传给子组件,子组件需要显式地用 props 选项声明 "prop":

下面我们就通过一个实例将message:hello传递给子组件。

运行之后,将“hello”显示的span标签上。

动态Prop

类似于用 v-bind 绑定 HTML 特性到一个表达式,也可以用 v-bind 动态绑定 props 的值到父组件的数据中。每当父组件的数据变化时,该变化也会传导给子组件:

 

运行结果如下:

 

当修改文本框中的内容,span的文本值也会随着改变。

© 著作权归作者所有

博为峰教研组
粉丝 52
博文 1224
码字总数 479077
作品 0
黄浦
程序员
私信 提问
加载中

评论(0)

Vue组件一-父组件传值给子组件

Vue组件一-父组件传值给子组件 开始 Vue组件是学习Vue框架最比较难的部分,而这部分难点我认为可以分为三个部分学习,即 组件的传值 - 父组件向子组件中传值 事件回馈 - 子组件向父组件发送消...

mdiep
2018/05/13
0
0
聊聊Vue.js组件间通信的几种姿势

写在前面 因为对Vue.js很感兴趣,而且平时工作的技术栈也是Vue.js,这几个月花了些时间研究学习了一下Vue.js源码,并做了总结与输出。 文章的原地址:https://github.com/answershuto/learnV...

染陌同学
2017/10/22
1.5K
2
[Vue 牛刀小试]:第十四章 - 编程式导航与实现组件与 Vue Router 之间的解耦

一、前言   在上一章的学习中,通过举例说明,我们了解了 Vue Router 中命名路由、命名视图的使用方法,以及如何通过 query 查询参数传参,或者是采用 param 传参的方式实现路由间的参数传...

osc_d4gurmqk
2019/07/03
4
0
[Vue 牛刀小试]:第九章 - 组件基础再探(data、props)

一、前言   在上一章的学习中,我们学习了 Vue 中组件的基础知识,知道了什么是组件,以及如何创建一个全局/局部组件。不知道你是否记得,在上一章中,我们提到组件是一个可以复用的 Vue ...

osc_feymneeg
2019/03/10
6
0
深入剖析Vue源码 - 选项合并(上)

对于大部分的前端开发人员来讲,熟练使用vue做项目是第一步,但当进阶后遇到一些特殊场景,解决棘手问题时,了解vue框架的设计思想和实现思路便是基础需要。本专题将深入vue框架源码,一步步...

不做祖国的韭菜
2019/03/18
0
0

没有更多内容

加载失败,请刷新页面

加载更多

数据结构和算法 | 第一部分第五课:算法复杂度实践

>作者 谢恩铭,公众号「程序员联盟」。 转载请注明出处。 原文:https://www.jianshu.com/p/060ef52580af >《数据结构和算法》全系列 内容简介 前言 寻找最大和最小的元素 寻找不重复的元素 ...

程序员联盟_
27分钟前
8
0
tomcat项目改造->jerryrat

先做一点笔记防止自己忘了,还有很多小细节要慢慢调试, 有些其实也不是漏洞,但是等保测试有些特殊的情况,只能去做兼容性的处理 1:编译tomcat8 https://tomcat.apache.org/download-80.cgi...

国产大熊猫
28分钟前
25
0
aop:aspect与aop:advisor的区别

https://www.jianshu.com/p/40f79da0cdef

osc_6jhxf9ab
28分钟前
28
0
Python破解24点游戏,从此打扑克就没输过

文源网络,仅供学习之用,如有侵权请联系删除。 24点游戏 对于任意给定的四张扑克牌,计算是否有赢得24点游戏的方法(即使用加、减、乘、除四则运算凑成24的方法);如果有的话,列出所有可能...

Python圈子
29分钟前
12
0
阿里短信回执.net sdk的bug导致生产服务cpu 100%排查

一:背景 1. 讲故事 去年阿里聚石塔上的所有isv短信通道全部对接阿里通信,我们就做了对接改造,使用阿里提供的.net sdk。 网址:https://help.aliyun.com/document_detail/114480.html 同事...

osc_slnrw1du
29分钟前
41
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部