vue2和vue3的区别?
vue2和vue3的主要区别在于以下几点:
1、生命周期函数钩子不同
2、数据双向绑定原理不同
3、定义变量和方法不同
4、指令和插槽的使用不同
5、API类型不同
6、是否支持碎片
7、父子组件之间传值方式不同
8、main.js文件中部分设置不同
下面详细说明具体有哪些不同?
一、生命周期函数钩子不同
| vue2 | vue3 |
|
beforeCreate 组件创建之前 created 组件创建之后 beforeMount 组件挂载到页面之前执行 mounted 组件挂载到页面之后执行 beforeUpdate 组件更新之前 updated 组件更新之后 |
setup 开始创建组件 onBeforeMount 组件挂载到页面之前执行 onMounted 组件挂载到页面之后执行 onBeforeUpdate 组件更新之前 onUpdated 组件更新之后 |
注意:vue3.x生命周期在调用前 需要先引入。除上述的钩子函数外,还增加了onRenderTracked和onRenderTriggered。
vue2和vue3的区别?的更多相关文章
- vue2与vue3的区别
template <template> <div class="wrap"> <div>{{ num }}</div> <Bu ...
- vue2和vue3的区别
一.常用命令 vue -V 查看本地 vue 版本 二.官方文档 3.0:https://cli.vuejs.org/zh/ 三.创建文件 3.0:vue create 进入工程文件夹,创建项目. 2 ...
- vue2和vue3生命周期的区别
概念 首先,我们了解一下"生命周期"这个词.通俗的来说,生命周期就是一个事务从出生到消失的过程.例如,一个人从出生到去世.在vue中,vue的生命周期是指,从创建vue对象到销毁v ...
- Vue2和Vue3技术整理1 - 入门篇 - 更新完毕
Vue2 0.前言 首先说明:要直接上手简单得很,看官网熟悉大概有哪些东西.怎么用的,然后简单练一下就可以做出程序来了,最多两天,无论Vue2还是Vue3,就都完全可以了,Vue3就是比Vue2多了一 ...
- vue2升级vue3:vue2 vue-i18n 升级到vue3搭配VueI18n v9
项目从vue2 升级vue3,VueI18n需要做适当的调整.主要是Vue I18n v8.x 到Vue I18n v9 or later 的变化,其中初始化: 具体可以参看:https://vue- ...
- vue2升级vue3指南(二)—— 语法warning&error篇
本文总结了vue2升级vue3可能会遇到的语法警告和错误,如果想知道怎样升级,可以查看我的上一篇文章:vue2升级vue3指南(一)-- 环境准备和构建篇 Warning 1.deep /deep/和 ...
- vue2升级vue3:Vue Demij打通vue2与vue3壁垒,构建通用组件
如果你的vue2代码之前是使用vue-class-component 类组件模式写的.选择可以使用 https://github.com/facing-dev/vue-facing-decorator ...
- 盘点Vue2和Vue3的10种组件通信方式(值得收藏)
Vue中组件通信方式有很多,其中Vue2和Vue3实现起来也会有很多差异:本文将通过选项式API 组合式API以及setup三种不同实现方式全面介绍Vue2和Vue3的组件通信方式.其中将要实现的通信 ...
- vue2与vue3实现响应式的原理区别和提升
区别: vue2.x: 实现原理: 对象类型:Object.defineProperty()对属性的读取,修改进行拦截(数据劫持): 数组类型:通过重写更新数组的一系列方法来进行拦截(对数组的变更方法 ...
随机推荐
- 开发工具-SVG占位图片
更新日志 2022年6月10日 初始化链接. https://toolb.cn/imageholder
- 在C#中使用正则表达式最简单的方式
更新记录 本文迁移自Panda666原博客,原发布时间:2021年5月11日. 在.NET中使用正则表达式与其他语言并无太大差异.最简单的使用就是使用Regex类型自带的静态方法. 注意:在.NET中 ...
- VR技术赋能五大领域,不止高级,更高效!
除了VR游戏.VR影视作品,究竟还有哪些产业领域会应用到VR技术并为生活带来改变呢?今天就帮大家好好梳理一下~ VR赋能交通,不只是高级 最近在网上看到了VR考驾照的新闻,网友都赞叹,现在学车都这么高 ...
- 前端学习 linux —— shell 编程
前端学习 linux - shell 编程 shell 原意是"外壳",与 kernel(内核)相对应,比喻内核外的一层,是用户和内核沟通的桥梁.shell 有很多种,国内通常使用 ...
- 重学ES系列之拓展运算符
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- java+mybatis实现一个简单的银行系统,实现存取款与账户查询
先创建数据库和表,使用的是MySQL数据库. create database mybatis; use mybatis; CREATE TABLE `accountdo` ( `id` varchar ...
- python爬虫之protobuf协议介绍
前言 在你学习爬虫的知识过程中是否遇到下面的类型.如果有兴趣学习一下或者了解相关知识的,且不嫌在下才疏学浅,可以参考一下.欢迎各位网友的指正. 首先叙述一下问题的会出现的式样. 你可能会在请求参数中看 ...
- ansible部署java及数据库环境
wget https://artifacts.elastic.co/downloads/elasticsearch/elasticsearch-6.3.1.rpm wget https://artif ...
- sql-DCL用户及权限管理及其他常用命令-mysql
查看系统信息 SHOW PROCESSLIST -- 显示哪些线程正在运行 SHOW VARIABLES -- 显示系统变量信息 SELECT now(), user(), version(); -- ...
- 【小程序自动化Minium】二、元素定位-Page接口中的 get_element() 与 get_elements()
UI自动化中的重要工作就是元素定位了,高效精准的定位方法可以让工作事半功倍. 在过去的一段web自动化经历中,使用的selenium库支持了多种定位方法,我们可以利用这些定位方法来做进一步封装,写出符 ...