专栏首页Java患者Vue基础总结2

Vue基础总结2

Vue中父子之间怎么样子传值的,非父子之间呢?

父-->子

1.pros传值法

父组件代码:

子组件代码:

子-->父

1.emit触发传值法

父组件代码

子组件代码

非父子传值

1.建立中间的事件bus总线

提示:遇到的问题:当我们还在页面first的时候,页面second还没生成,也就是页面second中的 created中所监听的来自于first中的事件还没有被触发。这个时候当你first中emit事件的时候,second其实是没有监听到的

解决方法:我们可以把A页面组件中的emit事件写在beforeDestory中去。因为这个时候,B页面组件已经被created了,也就是我们写的on事件已经触发了,所以可以在beforeDestory的时候,emit事件

而且在最后我们要在在second组件中的beforeDestroy中添加这句 bus.off('get', this.myhandle) 来进行手动销毁on

除了以上的组件传值方式,还有其他的吗?

1.我们可以在子组件中直接通过$parent获取父组件的值或者方法

父组件代码:

子组件代码:

2.我们可以在父组件中直接通过$children获取子组件的值或者方法

子组件代码:

父组件代码:

同时,我们也可以通过$ref来获取子组件中的值或则方法

父组件的代码:

最后我们阐述一下vue中的computed和watch的区别?

computed:是计算属性,依赖其它属性值,并且 computed 的值有缓存,只有它依赖的属性值发生改变,下一次获取 computed 的值时才会重新计算 computed 的值;

watch:当我们需要在数据变化时执行异步或开销较大的操作时,应该使用 watch

computed的写法:

watch的写法:

本文分享自微信公众号 - Java患者(gh_3a16ffdedb6a),作者:安雅兮

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2020-02-16

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • Swagger和Wired

    在我们前后端分离的架构中,前端与我们后端的开发是并行的,那么我们除了写自己的代码之外,我们还需要一些额外的的工具来帮助我们跟前端沟通,下面我们将为大家介绍2个常...

    用户7386338
  • 为什么我不建议你写注释?

    实际上,注释最多也就是一种必须的恶。若编程语言足够有表达力,或者我们擅长于用这些语言来表达意图,就不那么需要注释了,甚至也许根本不需要。 注释...

    用户7386338
  • 并发编程讲解(三)

    Java 中锁的种类包括偏向锁,自旋锁,轻量级锁,重量级锁。锁的使用方式先提供偏向锁,如果不满足的时候,升级为轻量级锁,再不满足,升级为重量级锁...

    用户7386338
  • 面向设计的半封装web组件开发

    本文内容可谓是对大脑认知的一场洗礼。我们平常提到组件,就会想到重用,各个项目都能使用。而本文的组件,对于某具体项目而言是组件,但是,对于其他项目,就是个半封装的...

    疯狂的技术宅
  • 面向设计的半封装web组件开发 - 腾讯ISUX

    腾讯ISUX
  • 面向设计的半封装web组件开发

    作者:张鑫旭,资深钓鱼爱好者,然后平时喜欢研究与学习前端技术。 前言 本文内容可谓是对大脑认知的一场洗礼。我们平常提到组件,就会想到重用,各个项目都能使用。而...

    腾讯大讲堂
  • vuejs组件通信精髓归纳

    父子关系即是组件 A 在它的模板中使用了组件 B,那么组件 A 就是父组件,组件 B 就是子组件。

    张炳
  • uni组件传值注意

    杨充
  • Vue父子组件通信

    Vue开发,父子组件之间通信很常用,有传数据的,有调用方法的,有子组件操作父组件,也有父组件操作子组件,今天就简单说一下几个父子组件之间通信的方法。

    wade
  • Vue组件嵌套时生命周期触发的顺序是什么?

    使用过 Vue 的大家,对于生命周期一定都很熟悉,在官方文档一开始,就给我们介绍了 Vue 的生命周期有哪些,是怎么样的顺序。这个难不倒大家。

    歪马

扫码关注云+社区

领取腾讯云代金券