vue3入门（一学就会，一用就废）

本文就是为了使用Vue3不是为了源码分析，请分析源码的同学等待下一篇发布，

推荐几个vscode的摸鱼插件

1. vetur ：集成了vue大多插件，代码高亮、代码提示等多个插件 2. Volar：实现代码分割，自动分成：template、script、style三块

一、话不多说开始vue3 1、创建项目

使用vue-cli创建项目

	1、// 安装或者升级 vue-cli
		yarn global add @vue/cli
		# 或
		npm install -g @vue/cl
		（注意之前安装过的卸载或者运行升级：vue upgrade --next）
	 2、//查看版本
	    vue --version
	3.、// 创建项目
			vue create my-project
			//然后根据提示操作就行了

使用vite安装（推荐真香）

npm安装：
	# npm 6.x
	$ npm init vite@latest <project-name> --template vue
	
	# npm 7+，需要加上额外的双短横线
	$ npm init vite@latest <project-name> -- --template vue
	
	$ cd <project-name>
	$ npm install
	$ npm run dev
yarn安装：
	$ yarn create vite <project-name> --template vue
	$ cd <project-name>
	$ yarn
	$ yarn dev

vue3的新语法：

1、setup：对比vue2周期：它实在beforeCreat与Create之前，所以没有this属性 2、setup的参数（props，context） props: 是一个对象,里面有父级组件向子级组件传递的数据,并且是在子级组件中使用props接收到的所有的属性 context：上下文对象，可以通过es6语法解构 setup(props, {attrs, slots, emit})

attrs: 获取当前组件标签上自定义属性, 类比于 this.$attrs
slots: 所有传入的插槽内容 类比于this.$slots
emit: 用来分发自定义事件的函数, 类比于 this.$emit