Vue14-监视属性

一、天气案例

1-1、方式一:{{三目运算符}}

1-2、方式二:计算属性

1-3、方式三:@click中写简单逻辑

@click里面可以写简单的逻辑语句。不用this

解决方式:


小结:

绑定事件的时候,@xxx="yyy"

xxx:事件

yyy:可以写一些简单的语句。

二、监视属性

2-1、watch属性

Vue.js 监听属性 watch,我们可以通过 watch 来响应数据的变化。

1、handler函数

2、immediate属性

3、watch中是否能监测计算属性

也可以监测计算属性

2-2、vm的监视

2-3、小结

三、深度检测

3-1、监视多级结构中某个属性的变化

需求1: 只检测a的值,不检测b的值。

3-2、监视多级结构中所有属性的变化

需求2:numbers中有很多属性,任何一个属性变了,都能检测到

3-3、小结

四、监视的简写

前提:watch属性中只有handler函数的时候,其他配置项没有的时候,才能简写。

方式一:

方式二:

注意:不要写成箭头函数!

相关推荐
摆烂工程师16 分钟前
ChatGPT免费用户可以使用Deep Research啦!并且o3、o4-mini的可使用次数翻倍!
前端·后端·程序员
狂炫一碗大米饭17 分钟前
作为前端你不得不知道的浏览器相关知识1🚀
前端
天天扭码24 分钟前
🔥 别再用 class 了!JS 原型链才是 YYDS
前端·javascript·面试
GISer_Jinger29 分钟前
📢《告别手动抓狂!Trae国际版+BrowserTools MCP 实现前端错误调试自动化》🚀
前端
前端大白话30 分钟前
震惊!90%前端工程师都踩过的坑!computed属性vs methods到底该怎么选?一文揭秘高效开发密码
前端·vue.js·设计模式
一天睡25小时30 分钟前
React与Vue表单的对比差异
前端·javascript
作曲家种太阳30 分钟前
第七章 响应式的 watch 实现【手摸手带你实现一个vue3】
前端
前端小巷子32 分钟前
深入解析 iframe
前端
WEI_Gaot33 分钟前
ES6 模板字符串
前端·javascript
前端大白话33 分钟前
前端工程师必看!手把手教你用CSS实现超丝滑的自适应视频嵌入
前端·css·前端框架