vue中计算属性与方法的不同之缓存

本文探讨了Vue.js中计算属性computed与方法methods在缓存机制上的不同。计算属性基于依赖缓存,只有依赖变化时才重新计算,而方法在每次渲染时都会重新执行。了解这一区别有助于优化应用性能。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

今天没太多进展,只是看了一点vue.js官网的一些东西。说实话,看的很吃力。今天总结一下vue中计算属性computed和方法methods在缓存上的区别。
在这里插入图片描述在这里插入图片描述以上两幅图中,实现的功能是相同的:将message的值反转。
图一是像绑定普通属性一样在模板中绑定计算属性,reversedMessage依赖于message,当 message 发生改变时,所有依赖 reversedMessage 的绑定也会更新。
图二是在表达式中调用方法。
【区别】计算属性是基于它们的依赖进行缓存的。只在相关依赖发生改变时它们才会重新求值。这就意味着只要 message 还没有发生改变,多次访问 reversedMessage 计算属性会立即返回之前的计算结果,而不必再次执行函数。相比之下,每当触发重新渲染时,调用方法将总会再次执行函数。如果你不希望有缓存,请用方法来替代。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值