分类：watch

2020
10-08

Vue watch响应数据实现方法解析

在vue中，使用watch来响应数据的变化。watch的用法大致有三种。下面代码是watch的一种简单的用法：<inputtype="text"v-model="cityName"/>newVue({el:'#root',data:{cityName:'shanghai'},watch:{cityName(newName,oldName){//...}}})直接写一个监听处理函数，当每次监听到cityName值发生改变时，执行函数。也可以在所监听的数据后面直接加字符串形式的方法名：watch:{cityName:'nameChange'}}... 继续阅读 >
2020
10-08

简单了解Vue computed属性及watch区别

自己的理解：1.computed用来监控自己定义的变量，该变量不在data里面声明，直接在computed里面定义，然后就可以在页面上进行双向数据绑定展示出结果或者用作其他处理；2.computed比较适合对多个变量或者对象进行处理后返回一个结果值，也就是数多个变量中的某一个值发生了变化则我们监控的这个值也就会发生变化，举例：购物车里面的商品列表和总金额之间的关系，只要商品列表里面的商品数量发生变化，或减少或增多或删... 继续阅读 >
2020
09-25

Vue的data、computed、watch源码浅谈

导读记得初学Vue源码的时候，在defineReactive、Observer、Dep、Watcher等等内部设计源码之间跳来跳去，发现再也绕不出来了。Vue发展了很久，很多fix和feature的增加让内部源码越来越庞大，太多的边界情况和优化设计掩盖了原本精简的代码设计，让新手阅读源码变得越来越困难，但是面试的时候，Vue的响应式原理几乎成了Vue技术栈的公司面试中高级前端必问的点之一。这篇文章通过自己实现一个响应式系统，尽量还原和Vue内部源码同样... 继续阅读 >