深入vue组件

chiuwingyan

于 2017-08-26 15:44:31 发布

阅读量200

点赞数

分类专栏： vue

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.csdn.net/chiuwingyan/article/details/77602581

版权

vue 专栏收录该内容

30 篇文章 0 订阅

订阅专栏

1、组件之间的通信

1）父组件向子组件传递信息

子组件中，要定义props属性，获取父组件传过来的值，可以接收数组和对象

在子组件的模板里直接用childMsg进行操作就可以了

这样写表示子组件只能接受数字和字符串

子组件向父组件传递内容

子组件，添加<slot>标签

向具名slot插入内容：

父组件中

子组件中

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
深入vue组件

1、组件之间的通信1）父组件向子组件传递信息子组件中，要定义props属性，获取父组件传过来的值，可以接收数组和对象父组件中，在子组件注册的标签里定义要传递的值这样写表示子组件只能接受数字和字符串父组件向子组件传递内容父组件子组件，添加标签向具名slot插入内容：父组件中子组件中
复制链接

扫一扫

专栏目录

chiuwingyan CSDN认证博客专家 CSDN认证企业博客

码龄7年

119: 原创

11万+: 周排名

148万+: 总排名

33万+: 访问

: 等级

3960: 积分

28: 粉丝

55: 获赞

19: 评论

168: 收藏

私信

关注

热门文章

分类专栏

react 27篇
vue 30篇
js 36篇
css 8篇
webpack 10篇
websocket 1篇
node 3篇
express 2篇
浏览器

最新评论

overflow-scrolling解决滚动卡顿问题
好多吃的啊: 赞赞赞
js普通函数加括号与不加括号的区别
m0_53074858: 学到了！
vue element-ui的$notify注意点
tiunxi: 楼sh的问题可以这么解决 private showRefreshUI(e: Event) { // Display a notification inviting the user to refresh/reload the app due // to an app update being available. // The new service worker is installed, but not yet active. // Store the ServiceWorkerRegistration instance for later use. const h = this.$createElement this.registration = (e as CustomEvent).detail this.$notify.info({ title: 'Update available', message: h('div', { class: 'sw-update-popup' }, [ this.notificationText, h('br'), h('button', { on: { click: (e: Event) => { e.preventDefault() this.refreshApp() } } }, this.refreshButtonText) ]), position: 'bottom-right', duration: 0 }) } private refreshApp() { 」
vue element-ui的$notify注意点
tiunxi 回复 chiuwingyan: private showRefreshUI(e: Event) { // Display a notification inviting the user to refresh/reload the app due // to an app update being available. // The new service worker is installed, but not yet active. // Store the ServiceWorkerRegistration instance for later use. const h = this.$createElement this.registration = (e as CustomEvent).detail this.$notify.info({ title: 'Update available', message: h('div', { class: 'sw-update-popup' }, [ this.notificationText, h('br'), h('button', { on: { click: (e: Event) => { e.preventDefault() this.refreshApp() } } }, this.refreshButtonText) ]), position: 'bottom-right', duration: 0 }) } private refreshApp() { // Protect against missing registration.waiting. if (!this.registration || !this.registration.waiting) return this.registration.waiting.postMessage('skipWaiting')

最新文章

目录

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。