vue3和vue2 的区别,vue3和vu2到底哪个好呢?

2022-11-24 00:00:00 开发 节点 方式 组件 钩子

vue3 正式发布有两年多了,之前也做过一些学习和研究。vue3 发布后给某培训机构开发了一套vue3课程课件,自己也开源了一套基于vue3的后台管理系统(因为个人懒的原因,半年后才上传到gitHub,且到目前为止一直没有更新过)。

附上网址:https://github.com/gegestst112/vue-stick-admin,有兴趣的可以下载看一下,希望我之后会继续完善和更新。

虽然现在还有很多用vue2的项目,甚至有新启动的项目还基于vue2。但vue3作为 vue 的主流开发技术栈,仍然是必然的趋势。因为现在 vue 官网文档也是 vue3 的版本了,指不定哪天要找 vue2 的文档都要花点功夫了。

近期整理一下 vue2 和 vue3 的不同点,希望对读到这篇文章的小伙伴从vue2过渡到vue3有些许帮助。

先来看下 vue2 和 vue3 有哪些相同点,至少先知道技术升级到 vue3 没有看起来那么难。

  1. vue3 中还是可以使用选项式 api 的写法,我们熟悉的data、props、computed、methods、watch、mixins 这些选项都还在;
  2. created、mounted 等生命周期钩子函数也还是熟悉的味道;
  3. 模板语法基本上一致,我们还是可以用 v-bind 绑定数据,v-on 绑定事件,v-if 和 v-for 渲染元素等等;

 

总结一下,即使不使用 vue3 新增的那些特性,也还是可以完成日常开发工作的。

不过,如果项目是使用 vue3 技术栈开发的,应该大部分人都会尝试适应vue3 组合式 api 语法。如果其他同事开发的模块用的都是组合式 api,唯独你还是用选项式 api,多少会有些违和感的。接下来看看 vue3 新增了哪些新特性

 

一、创建实例的方式不同

vue2 使用 new Vue({ ...选项 }) 构造函数的方式创建;

vue3 通过内置的 createApp( //根组件 ) 方法创建。

 

二、Vue3 新增的片断特性,允许单文件组件中的 template 元素下可以有多个节点

在 Vue 2 中的组件中的顶层 <template> 块不支持多个节点,通常都是用一个 div 元素包含所有节点或组件,如:

相关文章