01.初认vue3

vite基本使用

https://cn.vitejs.dev/

它是一个更加轻量（热更新速度快，打包构建速度快）的vue项目脚手架工具。
相对于vue-cli它默认安装的插件非常少，随着开发过程依赖增多，需要自己额外配置。
所以： 在单纯学习vue3语法会使用它，后面做项目的时候我们还是使用vue-cli

vite基本使用：

创建项目 npm init vite-app 项目名称 或者 yarn create vite-app 项目名称
安装依赖 npm i 或者 yarn
启动项目 npm run dev 或者 yarn dev

min.js

// 创建一个vue应用
// 1. 导入createApp函数
// 2. 编写一个根组件App.vue，导入进来
// 3. 基于根组件创建应用实例
// 4. 挂载到index.html的#app容器
import {createApp} from 'vue'
import App from './App.vue'
const app = createApp(App)
app.mount('#app')

选项API和组合API

1.Options ApI
在vue2.x项目中使用的就是 选项API 写法
代码风格：data选项写数据，methods选项写函数...，一个功能逻辑的代码分散。
优点：易于学习和使用，写代码的位置已经约定好
缺点：代码组织性差，相似的逻辑代码不便于复用，逻辑复杂代码多了不好阅读。
补充：虽然提供mixins用来封装逻辑，但是出现数据函数覆盖的概率很大，不好维护。

2.组合API写法：Compositon API
在vue3.0项目中将会使用 组合API 写法
代码风格：一个功能逻辑的代码组织在一起（包含数据，函数...）
优点：功能逻辑复杂繁多情况下，各个功能逻辑代码组织再一起，便于阅读和维护
缺点：需要有良好的代码组织能力和拆分逻辑能力.
补充：为了能让大家较好的过渡到vue3.0的版本来，也支持vue2.x选项API写法