Vue计算属性Computed_资讯

创始人

2024-05-30 18:05:15

Computed属性是Vue中的一个计算属性，是一种基于其它属性值计算而来的属性值，具有缓存机制，在依赖的属性值发生变化时会重新计算。

使用computed属性可以避免在模板中书写过多的计算逻辑，提高代码可读性和维护性。

下面是一个计算属性的示例：

计算属性是有缓存的, 当我们多次使用计算属性时, 计算属性中的运算只会执行一次。如下图：

computed缓存

计算属性默认是只读的，也就是只用到getter。当你尝试修改一个计算属性时，你会收到一个运行时警告。只在某些特殊场景中你可能才需要用到“可写”的属性，你可以通过同时提供 getter 和 setter 来创建：

需要注意的是，computed属性必须返回一个值，不能有副作用，如修改数据或触发异步操作等。如果需要有副作用的计算，可以使用watch属性。