vue 中watch函数名_不在迷惑,vue中的computed和method、watch

①computed和method的区别是,computed属性依赖缓存,所依赖的对象人如果没有变的情况,computed对应的状态不会改变

3c7b840aeb50e725720a3bfa545f6ad1.png

对菜鸟教程上给出的代码,多加了几行的改造,就能明显的看出来了,computed和methods的区别。computed中对应的方法的依赖状态没有变,所以加载一次之后,一直保持当前状态。与之相反的是,reverseMessage2对应的function,每次执行都会对方法进行调用,所以cnt对应的值,一直在递增。

这么解释并不是空穴来风,在官网的文档中就能够找到对应的依据,如下:

d76acd89bffcb0c723a6807319fea30e.png

在这种情况下,对于某一操作重复调用,或者计算量大,消耗性能比较严重的情况下,就可以选择computed计算属性,以减少性能的开销。

②watch与computed和methods又有所区别的是,watch是对指定动作的实时监听,与computed的区别是computed重点强调的是对缓存的依赖。watch重点强调的则是对事件的监听。

另外watch允许执行异步操作,并在最终得到结果之前设置中间状态,这对于computed都是不具备的属性

③created

72da8d1b454c22b8105db0706008007e.png

这里的$el可能不够明确是什么意思:

vm.$el的类型是Element,在官方的解释是,Vue实例使用的根DOM元素,created的说明中的言外之意是,实例完成配置,但是vue实例使用的根DOM元素还没有开始渲染。

④mounted

9f5d78cde8e3bb83b78a8cfec392250f.png

⑤vm.$on(event,callback)

监听当前实例上的自定义事件,事件可以由vm.$emit触发,回调函数会接收所有传入事件触发函数的额外参数。

aaaf92f24d859400c2082f850b6d71f6.png

从以上的这几个说明就可以看出,一方面是针对具体的vue中的基本语法的介绍。另一方面,可以看出,大部分的内容在官网和菜鸟教程上都能够有说明,协助理解。

API — Vue.js​cn.vuejs.org
a647448baee7f748c4ced4ba20006d7d.png
菜鸟工具 - 不止于工具​c.runoob.com

对于其他的内容就不再赘述了。学习“学习的能力”,比学习本身更加重要。对于更难于理解的内容,提出,并且进一步交流学习、分享。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值