VUE的component和components区别
component是注册全局组件，在实例化VUE前调用，注册后可以全局使用（动态路由）
components是局部注册组件，注册后只能在当页调用（父子组件）
vue.component和vue.use的用法
component是注册组件
use是注册插件
Vue.mixin( mixin )混入
全局注册一个混入，会影响每个单独创建的 Vue 实例 (包括第三方组件)
定义了一部分可复用的方法或者计算属性
computed
是多对一或者一对一
计算属性的结果会被缓存，不支持异步
computed 属性值会默认走缓存，
计算属性是基于它们的响应式依赖进行缓存的，
也就是基于data中声明过或者父组件传递的props中的数据通过计算得到的值
watch
是一对多
不支持缓存，数据变，直接会触发相应的操作
监听数据必须是data中声明过或者父组件传递过来的props中的数据，
当数据变化时，触发其他操作
watch的数据设置为函数的时候接收newVal和oldVal参数
设置为对象的时候才能添加immediate 【组件加载立即触发回调函数执行】
或者 deep属性【深度监听】
并且需要带上handler 作为watch的回调
vue
是MVVM
Model(数据)、View(界面)、ViewModel(数据绑定层)”
模型，视图，视图模型。
节点、树以及虚拟 DOM
当浏览器读到html代码时，建立一个“DOM。HTMLdocument的实例
它会建立一个“DOM 节点”树来保持追踪所有内容
每个元素，文字，注释都是一个节点
高效地更新所有这些节点会是比较困难的
只需要告诉 Vue 你希望页面上的 HTML 是什么，这可以是在一个模板里
template
Vue 选项中包含渲染函数，该模板将被忽略。
render就是渲染函数。JSX
vue生命周期 1、beforeCreate（创建前）：vue实例初始化之前调用 2、created（创建后）：vue实例初始化之后调用 3、beforeMount（载入前）：挂载到DOM树之前调用 4、mounted（载入后）：挂载到DOM树之后调用 执行render函数生成虚拟dom，创建真实dom替换虚拟dom，并挂载到实例。 可以操作dom，比如事件监听 5、beforeUpdate（更新前）：数据更新之前调用 6、updated（更新后）：数据更新之后调用 7、beforeDestroy（销毁前）：vue实例销毁之前调用 8、destroyed（销毁后）：vue实例销毁之后调用
keepalive（用处）
比如一个搜索页，用户在上面设置了一大堆筛选条件，
然后下面表格翻了若干页，然后点击某一项查看详情进去，
看完了返回这个列表页想要在之前的基础上继续选择下一条记录查看，
之前用户设置好的搜索条件就可以回显了
activated
keep-alive 组件激活时调用。该钩子在服务器端渲染期间不被调用
deactivated
keep-alive 组件停用时调用。该钩子在服务器端渲染期间不被调用
errorCaptured 当捕获一个来自子孙组件的错误时被调用。（2.5 可不了解直接vue3）
此钩子会收到三个参数：
错误对象、发生错误的组件实例以及一个包含错误来源信息的字符串
插槽
dom内容
这是插入到子组件的内容one
（坑位）父没有用就默认展示内容
这是插入到子组件的内容three
父组件
<template>
<div>
<div>
<div >E的页面</div>
<props :detail="fenl" ref="tit">
<!-- <template slot="one">
默认值one
</template> -->
<template v-slot:one>这是插入到子组件的内容one</template>
<template v-slot:three>这是插入到子组件的内容three</template>
</props>
</div>
</div>
</template>
子组件
<template>
<div>
<div >子组件</div>
<div v-for="(item,index) in detail" :key="index" @click="btn(item.text)">
<div>{{item.text}}</div>
</div>
<div style="margin-top:10px;color:skyblue;">
<div style="margin-right:55px;">
<slot name="one" >（坑位）如果父用了，就展示父内容</slot>
</div>
<div style="margin:0 5px; color:red;">
<slot name="two" >（坑位）父没有用就默认展示内容</slot>
</div>
<slot name="three"></slot>
</div>
</div>
</template>
子组件提供坑位，具名的，就是给坑位起咯个名，没有名字的默认是default，
父用了那个坑位，就会将坑位的内容替换，没人去这个坑，那坑就是原来的样
