Vue的计算属性和watch 侦听器【vue学习day3】

一、计算属性

注意：计算属性在页面初始化进来，也会计算一次

image.png

image.png

image.png

二、watch 侦听器 (监视器)

2.1. watch的简单写法

image.png

实时翻译功能实现

防抖实现，此地的timer并不需要响应式，可以直接定义在实例this身上，不需要在data函数中定义也可

image.png

2.2. watch的完整写法

简单写法的缺点

• 缺点1：无法在刚进入页面的时候自动触发；
• 缺点2：如果侦听的是一个对象，对象中的属性发生了变化，不会触发侦听器。

image.png

image.png