- 博客(5)
- 收藏
- 关注
原创 vue响应式分析(三)计算属性与侦听属性
计算属性与侦听属性 计算属性 computed,通过监听某些响应式数据,从而实现动态返回一个变量,和react hooks中的effect有点类似,可以实现相同效果。 // vue中写法 export default{ computed:{ name(){ return firstName + lastName } } } // react hooks写法 const App = () => { const [firstName,
2020-09-10 11:33:30 934 1
原创 nextTick原理解析
nextTick原理 在vue使用过程中,经常就会遇到dom节点更新未完成等情况,某些情况下就需要使用nexttick添加一个宏任务或微任务,在下一次tick中再触发当前回调,从而获取更新后的dom。 宏任务微任务 settimeout setinterval 是不精确的 JavaScript本身是个单线程的,由一个任务队列来决定当前执行的任务,另外有另一个队列用来做定时器的回调,定时器时间到达,则将定时器回调push到当前队列中,主线程任务执行完毕后,就会去执行定时器的回调,如果主线程上的任务过于繁琐,耗
2020-09-10 00:07:30 896
原创 vue响应式源码解析(二)
依赖派发 先前的文章主要提到的是响应式数据和依赖收集这部分逻辑,下面会花一些时间来讲述一下,依赖触发这部分的逻辑。 处理逻辑 依赖派发这部分逻辑针对对象和数组有着不同的处理方式,对象类型的依赖触发是在defineReactive中定义,而数组的依赖触发是在拦截器中定义,下面先来看一下对象类型的这部分逻辑处理: defineReactive定义 相关源码: defineReactive( obj: Object, key: string, val: any, customSetter?: ?Fu
2020-09-09 16:39:22 117
原创 vue响应式源码解析(一)
vue响应式源码解析(一) vue.js逐渐热门,在前端框架领域崭露头角这几年,也逐渐成为了前端面试的必考知识点,下面我会通过一系列源码解析的文章来帮助大家梳理这一部分的内容,如有对我的观点持有异议,请在评论区留言,友好交流。 vue的响应式是怎么实现的? 响应式,即vue的数据驱动视图,数据层面发生变化,导致UI进行重新渲染。数据响应式这部分涉及到的知识点有关依赖收集、依赖触发这两部分,核心思想就是将数据变换成observe的getter和setter形式。 依赖收集 我们都知道在JavaScript中,
2020-09-09 11:38:12 677
原创 多级菜单列表实现
核心思想 多级菜单列表,实现主要是依靠递归,最开始设置标志位,后续处理与先前不同,需要注意这一点。 注释部分代码是原先构思代码,只处理两层,后续根据递归完善响应代码。 需要注意,html只能解析到h5,所以之后的样式不正确,如果自己写,需要考虑这一点,避免直接用到开发环境。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="vie
2020-09-01 19:29:02 1086
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人