Vue 组件的本质就是调用一个 Vue 的方法来构建一个独立的模块
组件的实现必须有Vue实例对象
组件的模板需要使用一个父元素包裹起来
全局创建组件
接收两个参数，组件名，组件对象。
组件命名规则：首字母大写，使用驼峰命名的规则
局部创建组件
局部组件的定义请拿到 Vue 实例化外部进行声明一个纯粹的对象即可，以避免代码的不好阅读
组件的调用像普通的标签一样调用即可
组件的名称首字母改成小写，驼峰的地方使用 - 进行拼接
<my-haha></my-haha>
高频面试题
vue 的组件是一个具有完整功能的独立模块
为什么在组件中，data必须是函数？
因为组件会被多次调用，如果这里只定义一个对象的话，那么所有的组件都会复用这个对象，就会造成数据之间的互相污染
如果我们使用 函数 return的方式，每次调用组件都会 return 出现一个新的对象，确保数据的安全和独立性
简单来说就是确保每一个组件的数据独立性
父子组件通信
一.父组件data中的数据想让子组件使用
1.在父组件模板（父组件模板就是父组件挂载的元素）中在标签内保存数据
这里mag因为作为一个属性值所以在父组件中data数据声明了，info和color可以不用声明
2.在子组件使用props保存数据
3.在子组件模板中使用数据
二.父组件分发数据给子组件
1.在父组件模板中在标签内保存数据
这里的info自定义属性的num值在父组件中的data对象里定义了
2.在子组件使用props保存数据
3.子组件使用父组件数据
slot属性相当于一个插槽，在父组件模板定义了这个参数后，子组件模板中的slot标签会插入这个插槽中
如果找到了插槽就插进去挂载在页面中，如果没有找到就消失，但是如果在props中设置了默认值的话
会显示默认值挂载在页面中
子组件给父组件传值
1.在父组件中定义一个事件a触发执行的代码
2.在父组件模板中定义a事件函数的触发条件为c自定义方法
3.在子组件模板中定义事件b
4.在子组件中定义事件b触发执行的代码
该方法的逻辑是触发子组件模板中的事件b，b事件用$emit()会触发父组件的c方法。c方法触发了后会调用a方法
这样就能让子组件改变父组件的值
为什么子组件不能直接改变父组件的值？
父组件给子组件传参是单向数据流，父组件不知道子组件操作是否合法，避免不安全因素产生
如果可以修改值，可能会污染数据。
三.Vue-cli 安装
1.全局安装Vue-cli
在任意地方打开控制台输入npm i -g @vue/cli
2.在指定文件夹创建脚手架环境
在指定文件夹下输入vue create 自定义文件名
3.？please pick a preset 请选择一个预设，选择最后一个自定义预设
4. 在自定义预设中选择自己需要的包
(1).choose vue version 选择vue版本
(2).Babel 解析器
(3). Router 路由
(4).VueX 状态管理工具
一般选择这几个就行
5.keys 选择Vue版本 选择2.X或者3.X
之后一直回车直到出现cd 你创建的文件名和npm run serve
6.输入提示的cd 文件名和npm run serve
开启Vue-cli脚手架环境
以后项目需要开启，就需要启动脚手架环境，重新输入npm run serve
安装以后components文件夹里面就是你所有的组件
需要调用直接在App.vue里面直接导包即可
import 组件名 from “组件地址”
常用$指令
$nextTick 将回调延迟到下次 DOM 更新循环之后执行
$emit 子组件通过emit触发父组件自定义的方法，来执行父组件的函数
$on 兄弟之间传递参数，使用事件总线，配合生命周期函数使用，a组件emit向父组件传递事件，b组件通过on方法接受传递过来的事件
$off 销毁事件总线
$route 是一个跳转的路由对象，每一个路由都会有一个route对象，是一个局部的对象，可以获取对应的name,path,params,query等
$router 是VueRouter的一个实例对象 是一个全局对象，它包含了所有路由，钩子函数，还有很多对象和属性
!!取反两次
节约性能快速转化为布尔值
