Vue学习笔记（五）

组件高级（上）

（一）watch侦听器(会用到）

1.作用：监视数据的变化并做特定的操作。

2.使用：在watch节点下定义（和data平级）

方式：侦听器名称(newVal,oldVal){操作语句}

p·s：用不到oldVal可以省略

3.使用watch检测用户名是否可用：监听username的变化，并使用axios(别忘了import axios)发起ajax请求检测是否可用（连接后台）用await获取数据(别忘了加async)，{}解构赋值可以把需要的属性拿出来，冒号可以重命名,后面的是新名字

eg:const {data:res}=await axios.get("地址")

4.immediate选项：让初次加载就立即被调用

方法：在定义watch的时候不再直接定义方法，而是定义对象，里面有侦听器(命名为handler)，并设置immediate: true。

5.deep选项：侦听对象内部属性的变化

方法：在定义的watch对象里写deep: true,可以监听对象内部每个属性的变化

6.监听单个属性的变化：

方法：定义watch对象的名称用"对象.属性名"【要有引号】，内部定义handler函数