计算属性和侦听属性

使用 计算属性 来描述依赖响应式状态的复杂逻辑
计算属性与方法区别:

  1. computed 是带缓存的,如果被依赖的变量不发生变化,则下次调用 computed 时不会重新计算结果。
    但是 methods 则是每次调用都会重新运行以得出实时的结果。
  2. methods 调用需要加 ()
  3. computed 依赖响应式变量 (ref,reactive) ,不可传值; methods 可以传值
计算属性和侦听属性有什么区别?怎样选择

1、computed不会主动监听数据变化,但是watch会去主动监听,也就是说watch会主动处理数据变化,computed是依赖数据变化才去计算。

2、computed在依赖数据未发生改变时/或者没有依赖数据,自动缓存到应用中,下次获取时不重新计算。

各自使用场景:

watch:适合处理 一个数据影响多个数据,理数据相互独立的场景,主动监听

computed:适合处理多个数据影响一个数据时,数据相互不独立的场景。

复制代码
import { computed, ref } from "vue";
const count = ref(0); //声明
const twofold = computed(() => {
return count.value * 2;
});
相关推荐
HackTwoHub4 小时前
AntiDebug Mcp、AI逆向绕过前端,Hook 加密接口,抓取 Vue 路由漏洞,接入 MCP 让 AI 自动化挖掘前端漏洞
前端·vue.js·人工智能·安全·web安全·网络安全·系统安全
Mr_凌宇4 小时前
AI 应用工程进阶扩展学习笔记 二
前端·面试
Hyyy4 小时前
Git Worktree 完全讲解
前端·后端·面试
铁皮饭盒5 小时前
Bun 处理 IO 密集型比 Java 强多少?
javascript
李明卫杭州5 小时前
还在用 Vue2 的 $set?一文吃透 Observable 响应式原理与 Vue3 的 Proxy 重构
vue.js
anod5 小时前
Amazon反爬虫:一场从自动化到Chrome插件的折腾之旅
javascript·chrome·amazon·插件
葡萄城技术团队5 小时前
AI 不会淘汰电子表格,反而会让电子表格成为 AI 操作系统
前端·人工智能
BigTopOne5 小时前
Short Put and Short Call
前端
Cache技术分享5 小时前
465. Java 反射 - 获取类的简单名
前端·后端
英勇无比的消炎药5 小时前
层级选择不再手写联动:TinyVue Cascader 级联选择器上手
vue.js