computed和watch的区别? (vue)
2022/1/23 23:09:01
本文主要是介绍computed和watch的区别? (vue),对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
1.computed 计算属性(必须有返回值 (return)),数据受其他数据的影响,一般用于购物车计算等。
注意:依赖的数据发生改变时,计算属性才会重新计算
computed: { // 第一种写法:方法写法 // computedTotal () { // 名字不在data中定义 // === computed:function(){} // return this.num1 + this.num2 // }, // 第一种写法:对象写法 computedTotal: { get () { // get:function(){} return this.num1 + this.num2 }, set (val) { // set:function(){} } } },
2.watch 监听,当观察的值发生改变,页面就立刻改变。
watch: { /*对象写法, 名字必须定义了*/ watchTotal: { handler () { this.watchTotal = this.num1 + this.num2 }, immediate: true, // 立即执行一次 handler deep: true, // 深度监听 }, // 方法写法 // watchTotal (newValue, oldValue) { // this.watchTotal = this.num1 + this.num2 // 不起反应的时候就要对象写法 // }, },
加载顺序: props - > methods - > data - > computed - > watch
这篇关于computed和watch的区别? (vue)的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2025-01-04React 19 来了!新的编译器简直太棒了!
- 2025-01-032025年Node.js与PHP大比拼:挑选最适合的后端技术进行现代web开发
- 2025-01-03?? 用 Gemini API、Next.js 和 TailwindCSS 快速搭建 AI 推文生成项目 ??
- 2024-12-31Vue CLI多环境配置学习入门
- 2024-12-31Vue CLI学习入门:一步一步搭建你的第一个Vue项目
- 2024-12-31Vue3公共组件学习入门:从零开始搭建实用组件库
- 2024-12-31Vue3公共组件学习入门教程
- 2024-12-31Vue3学习入门:新手必读教程
- 2024-12-31Vue3学习入门:初学者必备指南
- 2024-12-30Vue CLI多环境配置教程:轻松入门指南