vue进阶
7篇文章 · 0订阅
  • 关于Vue3获取当前组件实例的 getCurrentInstance 方法的补充
    在Vue2的各个组件中，我们频繁地使用 this ，即获取当前组件实例，是因为每个组件的数据变量、方法都要通过组件实例去获取。 1. 获取数据 2. 使用方法 3. 获取当前组件根元素 4. 子组件向父组件通信 5. 获取Vuex对象 大家不要依赖 getCurrentInst…
    Vue.js
    关于Vue3获取当前组件实例的 getCurrentInstance 方法的补充
  • Vue3.0 性能优化及新特性深度解析
    在之前的VDOM中，如果msg值发生改变，整个模版中的所有元素都需要重新渲染。但在Vue3.0中，在这个模版编译时，编译器会在动态标签末尾加上 /* Text*/ PatchFlag。只能带patchFlag 的 Node 才被认为是动态的元素，会被追踪属性的修改。并且 Pat…
    Vue.js
    Vue3.0 性能优化及新特性深度解析
  • Vue 装饰器写法
    是Vue主要贡献者在vue-class-component基础上封装的针对vuex的装饰器写法的库。它提供了4个装饰器和namespace event: string 事件名。 options: Constructor | Constructor[] | PropOptions…
    Vue.js
  • 详解vue的diff算法
    目标是写一个非常详细的关于diff的干货，所以本文有点长。也会用到大量的图片以及代码举例，一起来get吧。 先来了解几个点... 1. 当数据发生变化时，vue是怎么更新节点的？ 要知道渲染真实DOM的开销是很大的，比如有时候我们修改了某个数据，如果直接渲染到真实dom上会引起…
    Vue.js
    详解vue的diff算法
  • vue中8种组件通信方式, 值得收藏!
    作者简介：koala，专注完整的 Node.js 技术栈分享，从 JavaScript 到 Node.js,再到后端数据库，祝您成为优秀的高级 Node.js 工程师。【程序员成长指北】作者，Github 博客开源项目 https://github.com/koala-codi…
    Vue.js HTML
    vue中8种组件通信方式, 值得收藏!
  • 为什么使用v-for时必须添加唯一的key?
    两个相同的组件产生类似的DOM结构，不同的组件产生不同的DOM结构。 同一层级的一组节点，他们可以通过唯一的id进行区分。基于以上这两点假设，使得虚拟DOM的Diff算法的复杂度从O(n^3)降到了O(n)。 当某一层有很多相同的节点时，也就是列表节点时，Diff算法的更新过程…
    Vue.js 前端
  • key在Vue列表渲染时究竟起到了什么作用
    Vue2+采用diff算法来进行新旧vnode的对比从而更新DOM节点。而通常在我们使用v-for这个指令的时候，Vue会要求你给循环列表的每一项添加唯一的key，那么这个key在渲染列表时究竟起到了什么作用呢？ 在解释这一点之前，你最好已经了解Vue的diff算法的具体原理是…
    Vue.js