vue2和vue3的区别

大区别

1.速度更快：ts重构 -- TypeScript

2.双向绑定方式不同：vue2使用Object.definePropery(),vue3使用Proxy

3.vue3的组合式API

4.打包方式不同：由webpack转向vite

5.vue3发布时间：2020年9月18日，2022年2月7日成为默认版本

小区别

1.生命周期钩子不同：销毁的生命周期钩子

2.template根元素个数：vue2只能有一个，vue3可以多个

3.template DOM中调用子组件时vue2不能使用驼峰命名，vue3可以

Vue3入门基础

一、安装

1.使用<script>引入：1.下载引入

2.CDN

2.使用NPM：1.导入包

2.cli工具：@vue/cli

二、@vue/cli

1.安装cli工具：$ npm i @vue/cli -g

2.构建项目：$ vue create admin -- 基于webpack

3.运行项目：$ npm run serve

4.问题：1.如果已经安装了vue-cli，那么需要先卸载再安装

2.卸载时一定要看到是remove success，不能是up to date,如果命令行卸载不了，就直接去C:\Users\YSS\AppData\Roaming\npm\先删除所有和vue相关的文件，然后到node_modules下删除vue文件夹，然后再安装

3.@vue/cli4要求node v8.9以上版本，推荐v10以上，@vue/cli5要求node v12或v14以上版本，如果装不了5以上版本，那么就安装$ npm i @vue/cli@4 -g

三、基本语法

1.创建根实例：Vue.createApp()

2.实例方法：app.use()：安装vue.js插件

app.mount()：挂载元素

四、Element-UI

1.基于vue的桌面端UI组件库

2.Element Plus：基于vue3

3.兼容性：不支持IE浏览器

4.安装：

1.使用<script>,<link>引入

2.使用NPM安装

5.使用NPM安装：

1.$ npm i element-plus -S

2.在main.js文件中导入

import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'

3.绑定到Vue：app.use(ElementPlus)