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

方式一:

方式二:

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

相关推荐
xkxnq几秒前
第一阶段:Vue 基础入门(第 14天)
前端·javascript·vue.js
前端小臻几秒前
列举react中类组件和函数组件常用到的方法
前端·javascript·react.js
筱歌儿6 分钟前
TinyMCE-----word表格本地图片转base64并上传
前端·word
0思必得07 分钟前
[Web自动化] Selenium简单使用
前端·python·selenium·自动化·web自动化
2301_818732069 分钟前
下载nvm后,通过nvm无法下载node,有文件夹但是为空 全局cmd,查不到node和npm 已解决
前端·npm·node.js
赵民勇11 分钟前
JavaScript中的this详解(ES5/ES6)
前端·javascript·es6
hhcccchh11 分钟前
学习vue第九天 计算属性与侦听器
前端·vue.js·学习
Irene199114 分钟前
Vue 3 中,defineComponent 提供了更好的 TypeScript 类型推断
vue.js·typescript·definecomponent
我的golang之路果然有问题14 分钟前
Mac 上的 Vue 安装和配置记录
前端·javascript·vue.js·笔记·macos
代码游侠17 分钟前
应用——Linux FrameBuffer图形显示与多线程消息系统项目
linux·运维·服务器·开发语言·前端·算法