vue复习之路--(一)computed和watch分别实现模糊搜索功能
vue中watch和computed是常用的两个方法，下面分别聊聊在什么场景下适合用哪个，最后分别用他们实现模糊搜索功能可以简单做个对比
在此之前先简单聊聊数据代理
文章图片
模糊搜索功能拆分为两步：
1.收集用户输入信息
2.对列表进行过滤
watch实现姓名模糊搜索功能
文章图片
从上面例子可以看出watch监测原有属性keyword，并且对用户每次的输入行为进行监测，每次输入都触发更新
computed实现姓名模糊搜索
文章图片
computed直接定义新属性filterNameList,并且监测该属性是否改变，如果改变就触发更新
【vue复习之路--(一)computed和watch分别实现模糊搜索功能】小结：
1.vue中watch其实是数据代理的一种应用，通过watch函数对data里面的属性进行读取和修改
2.computed能实现的功能，watch都能实现,computed有缓存效果，两者都可以实现的功能推荐优先使用computed
3.watch通常用于监测data中已经存在的属性，computed通常定义新的属性
4.有异步操作只能用watch不能用computed
推荐阅读
- 血淋淋的教训—将Vue项目打包成app的跨域问题
- Android破解学习之路—— 乐秀视频编辑 内购破解 专业版 价值40元的破解
- Vue 仿饿了么app
- vue|vue+element项目动态添加删除数据div
- vue.js|vue + element-UI 实现深色模式和主题色动态切换
- vue|vue 在js 文件中使用store_【vue】vue +element 搭建项目，vuex中的store使用
- vue|vue + element-ui 聊天_优秀的10个Vue开源项目
- vue+echarts|vue+echarts 后台获取数据_vue+element+echarts 响应式后台管理系统，了解一下（）
- 前端|Vue + TypeScript + Element 项目实战及踩坑记
- vue中tab切换前端实现_vue + element-ui 制作tab切换（切换vue组件，踩坑总结）