即将2022年了，Vue3.x详细版为尔奉上（对比Vue2.x，打包带走）

Vue3知识已经为你总结好，赶紧学起来吧~~~

Vue3新特性体验--上（内附简单实例，可直接使用）_前端不释卷leo的博客-CSDN博客1、先创建一个简单vue2项目，node、vue-cli、webpack等准备完成之后，创建vue3-test文件夹，cd vue3-test，然后vue init webpack，配置项目信息，创建vue2项目（安装vue-router、vuex）。vue2项目文件目录详情2、记录文件main.js、HelloWorld.vue、A.vue、B.vue 、router、vuex。（与vue3做对比）main.jsimport Vue from 'vue'import App fr.https://blog.csdn.net/qq_41809113/article/details/121041442 Vue3新特性体验--中（Composition API）_前端不释卷leo的博客-CSDN博客Vue3中的Composition API主要作用是便于整合代码，将实现相同功能的代码集中在一起，便于维护管理，Composition API新特性的入口-- setup()函数，该函数是为组件提供的新属性。造个简单的实例感受一下。本篇实例代码在上篇的基础上进行修改：Vue3新特性体验--上（内附简单实例，可直接使用）_前端菜小白leo的博客-CSDN博客现在，我们在A组件实现一个小功能，点击按钮改变显示内容。vue2中的写法：<template> <div clhttps://blog.csdn.net/qq_41809113/article/details/121046555

Vue3新特性体验--下（各式各样API，完结篇）_前端不释卷leo的博客-CSDN博客_vue3这是Vue3新特性体验的最后一篇，推荐先把上、中篇看完，然后继续本文的阅读。Vue3新特性体验--上（内附简单实例，可直接使用）_前端菜小白leo的博客-CSDN博客Vue3新特性体验--中（Composition API）_前端菜小白leo的博客-CSDN博客依然使用与上、中篇同样的简单实例。回顾一下实例目录与页面展示接下来，继续Vue3新特性的体验之旅。provide和inject我们已经了解父子组件通信可以使用props跟emit，那么跨层级（祖孙）通信该如何？可以..https://blog.csdn.net/qq_41809113/article/details/121060088

Vue2 与 Vue3 的生命周期对比图：

  

官网Vue3.x地址妥妥安排上Vue.jsVue.js - The 渐进式 JavaScript 框架https://v3.cn.vuejs.org/