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函数的时候,其他配置项没有的时候,才能简写。

方式一:

方式二:

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

相关推荐
若梦plus6 分钟前
React之react-dom中的dom-server与dom-client
前端·react.js
若梦plus8 分钟前
react-router-dom中的几种路由详解
前端·react.js
若梦plus9 分钟前
Vue服务端渲染
前端·vue.js
Mr...Gan20 分钟前
VUE3(四)、组件通信
前端·javascript·vue.js
OEC小胖胖21 分钟前
渲染篇(二):解密Diff算法:如何用“最少的操作”更新UI
前端·算法·ui·状态模式·web
万少27 分钟前
AI编程神器!Trae+Claude4.0 简单配置 让HarmonyOS开发效率飙升 - 坚果派
前端·aigc·harmonyos
前端工作日常32 分钟前
我学习到的描述项目持续迭代具体成果
前端·测试
德育处主任36 分钟前
p5.js 从零开始创建 3D 模型,createModel入门指南
前端·数据可视化·canvas
前端工作日常39 分钟前
我学习到的 npx 命令
前端·npm
给力学长42 分钟前
自习室预约小程序的设计与实现
java·数据库·vue.js·elementui·小程序·uni-app·node.js