Vue中常见的知识点


发文时间:2019年01月24日 00:06:55     编辑:Aaron      标签:vue 974


1、vue2双向绑定原理


采用数据劫持结合发布者-订阅者模式的方式,通过Object.defineProperty()来劫持各个属性的setter,getter,在数据变动时发布消息给订阅者,触发相应的监听回调。


2、Vue3.x响应式数据原理


Vue3.x改用Proxy替代Object.defineProperty 。

因为Proxy可以直接监听对象和数组的变化,并且有多达13种拦截方法。并且作为新标准将受到浏览器厂商重点持续的性能优化。

Proxy只会代理对象的第一层,Vue3是怎样处理这个问题的呢?

判断当前Reflect.get的返回值是否为Object,如果是则再通过reactive方法做代理, 这样就实现了深度观测。

监测数组的时候可能触发多次get/set,那么如何防止触发多次呢?我们可以判断key是否为当前被代理对象target自身属性,也可以判断旧值与新值是否相等,只有满足以上两个条件之一时,才有可能执行trigger。

3、vue生命周期


beforeCreate( 组件的data和methods以及页面DOM结构,都还没有初始化)、


created( 实例已初始化,挂载阶段还没开始,$el 属性目前不可见)、


beforeMount( 此时内存中的模板结构,还没有真正渲染到页面上;页面上看不到真实的数据,用户看到的只是一个模板页面而已)、mounted( el 被新创建的 vm.$el 替换,并挂载到实例上去之后调用该钩子)、


beforeUpdate、


updated、beforeDestory、destoryed


4、vue-router 导航守卫


1)全局守卫

        ① beforeEach(全局前置守卫)

        ② beforeResolve(全局解析守卫, 在导航被确认之前, 同时在所有组件内守卫和异步路由组件被解析之后,解析守卫就被调用)

        ③ afterEach(全局后置钩子, 和守卫不同的是,这些钩子 不会接受  next  函数也不会改变导航本身)

(2)单个路由独享的

         beforeEnter   这些守卫与全局前置守卫的方法参数是一样的)

(3)组件间的守卫

        beforeRouteEnter ( 不能  访问  this ,因为守卫在导航确认前被调用,因此即将登场的新组件还没被创建)

        beforeRouteUpdate

        beforeRouteLeave

5、Vuex有哪几种属性?

有五种,分别是state(存储状态)、getters(相当于计算属性)、mutations(同步更新数据)、a'ctions(异步更新数据)、modules(模块化)


 

若无特殊说明,此文章为博主原创。
写稿不易,如需转载,请注明出处: https://www.aaroner.cn/art/18.html




  猜你喜欢的文章

SITE MAP

  FOLLOW US