乐趣区

关于javascript:vue复习之路一computed和watch分别实现模糊搜索功能

vue 中 watch 和 computed 是罕用的两个办法,上面别离聊聊在什么场景下适宜用哪个,最初别离用他们实现含糊搜寻性能能够简略做个比照
在此之前先简略聊聊数据代理

含糊搜寻性能拆分为两步:
1. 收集用户输出信息
2. 对列表进行过滤
watch 实现姓名含糊搜寻性能

从下面例子能够看出 watch 监测原有属性 keyword,并且对用户每次的输出行为进行监测,每次输出都触发更新
computed 实现姓名含糊搜寻

computed 间接定义新属性 filterNameList, 并且监测该属性是否扭转,如果扭转就触发更新

小结:
1.vue 中 watch 其实是数据代理的一种利用,通过 watch 函数对 data 外面的属性进行读取和批改
2.computed 能实现的性能,watch 都能实现,computed 有缓存成果,两者都能够实现的性能举荐优先应用 computed
3.watch 通常用于监测 data 中曾经存在的属性,computed 通常定义新的属性
4. 有异步操作只能用 watch 不能用 computed

退出移动版