watch监听表单的某个值_computed,watch和method, 这些Vue特性get到手,月薪过万,面试不愁

1.使用idea创建一个静态web的工程

2.执行命令,初始化项目

3.安装Vue环境

4.computed使用

    Title

日期①: {{new Date(birthday).getFullYear()}}-{{new Date(birthday).getMonth()+1}}-{{new Date(birthday).getDay()}}
日期②: {{birth}}

4.watch基本使用和深度监控

    Title

+

名称:{{person.name}} 年龄:{{person.age}}

5.method使用

这个就不举例子了,如果连这个都不会,赶紧去看一下Vue基础知识

6.说一说computed,watch和method

computed

1.是计算值,属性调用

2.computed定义的方法我们是以属性访问的形式调用的，{{computedTest}}

3.具有缓存性，页面重新渲染值不变化,计算属性会立即返回之前的计算结果，而不必再次执行函数

4.防止文本插值中逻辑过重，导致不易维护

watch

1.是观察的动作，

2.监听props，$emit或本组件的值执行异步操作

3.无缓存性，页面重新渲染时值不变化也会执行

method

1. methods是函数调用,必须要加上()来调用，如{{methodTest()}}
2. methods无缓存功能

7.总结:

1、有时候，computed和watch可以实现相同的功能；

2、当需要在数据变化时执行异步或开销较大的操作时，使用watch会更好一些。因为computed会立即返回，此时异步操作可能还没有完成；

3、使用immediate:true，会在初始化watch时就立即执行handler回调函数，而不用等下一次数据更新。

4、使用deep:true，才会递归监听对象的属性(如果监听的是对象或数组)