前端学习笔记(10)-vue2和vue3的区别总结

1、Composition API


这是vue2.x和vue3.x之间最大的区别。Vue2使用选项类型API(Options API)相比之下,Vue3使用组合式(Composition API)。

前端学习笔记(7)-Vue组合式api的理解及使用_江正阳的博客-CSDN博客

2、vue2和vue3双向数据绑定原理发生了改变


vue2 的双向数据绑定是利用ES5 的一个 API Object.definePropert()对数据进行劫持 结合 发布订阅模式的方式来实现的。
vue3 中使用了 es6 的 ProxyAPI 对数据代理。

前端学习笔记(8)-Vue2和Vue3双向数据绑定原理对比_江正阳的博客-CSDN博客
 

3、生命周期钩子不同 — Lifecyle Hooks

前端学习笔记(9)-Vue2和 Vue3生命周期区别_江正阳的博客-CSDN博客

4、Vue3支持碎片(Fragments),Teleport瞬移组件

4.1 Fragments

  • Vue2中: 组件必须有一个根标签
  • Vue3中: 组件可以没有根标签, 内部会将多个标签包含在一个Fragment虚拟元素中
  • 好处: 减少标签层级, 减小内存占用

4.2 Teleport

  • Teleport 是一种能够将我们的模板移动到 DOM 中 Vue app 之外的其他位置的技术。
  • 如果我们嵌套在 Vue 的某个组件内部,那么处理嵌套组件的定位、z-index 和样式就会变得很困难。
  • 使用Teleport 就可以方便的解决组件间 css 层级问题

5、vue3父子传参的不同

前端学习笔记(14)-Vue3组件传参_吃花椒的恩酱的博客-CSDN博客​​​​​​​


(未完)



 

猜你喜欢

转载自blog.csdn.net/JiangZhengyang7/article/details/127996396