1.组件的之间的传参调方法
v3、
props（常用）
$emit（常用）
expose / ref（常用）
provide / inject（常用）
Vuex（常用）
$attrs
v-model
mitt
v2、
props（常用）
$emit / v-on（常用）
slot（常用）
ref（常用）
Vuex（常用）
provide / inject
parent
listeners
v-model
EventBus
$root
.sync
父组件传值给子组件，子组件使用props进行接收
子组件传值给父组件，子组件使用$emit+事件对父组件进行传值
组件中可以使用$parent和$children获取到父组件实例和子组件实例，进而获取数据
使用$attrs和$listeners，在对一些组件进行二次封装时可以方便传值，例如A->B->C
使用$refs获取组件实例，进而获取数据
使用Vuex进行状态管理
使用eventBus进行跨组件触发事件，进而传递数据
使用provide和inject，官方建议我们不要用这个，我在看ElementUI源码时发现大量使用
使用浏览器本地缓存，例如localStorage
父子组件通信可以用：
props
$emit / v-on
listeners
ref
.sync
v-model
parent
EventBus （$emit / $on） 适用于 父子、隔代、兄弟组件通信
兄弟组件通信可以用：
EventBus
Vuex
$parent
跨层级组件通信可以用：
provide/inject
EventBus
Vuex
listeners
$root
2.vue生命周期
从开始创建、初始化数据、编译模版、挂载 Dom -> 渲染、更新 -> 渲染、卸载等一系列过程
V3、
onBeforeMount
onMounted
onBeforeUpdate
onUpdated
onBeforeUnmount
onUnmounted
onActivated
onDeactivated
onErrorCaptured
V2、
beforeCreate: // 在实例初始化之后， 数据观测 和 event/watcher 事件配置之前被调用。
created: // 实例已经创建完成之后被调用。实例已完成如： 数据观测，属性和方法的计算，watch/event事件回调。
beforeMount: // 在挂载开始之前被调用， 该函数在服务器端渲染期间不会被调用。
mounted: // el被新创建的 vm.$el替换，并挂载到实例上去之后调用该函数，在该函数内可以获取元素。
render: // 页面被渲染时会调用该函数。该函数在mounted之前会被调用。
beforeUpdat // 数据更新时调用，发生在虚拟Dom重新渲染之前。该函数在服务器端渲染期间不会被调用。
updated: // 由于数据更改导致虚拟DOM重新被渲染会调用。在被渲染后调用该函数。可以或许新的dom元素。该函数在服务器端渲染期间不会被调用。
activated: // keep-alive组件激活时调用 该函数在服务器端渲染期间不会被调用。
deactivate: // keep-alive 组件停用时被调用。该函数在服务器端渲染期间不会被调用。
beforeDestro: // 实例销毁之前被调用，实例仍然完全可用 该函数在服务器端渲染期间不会被调用。
destroyed: // Vue 实例销毁后调用，调用后，Vue实例所有东西都会被解绑定，所有的事件监听器会被移除，所有的实例被销毁。
V2到V3的变化
v3现在没有了beforeCreate和created(创建)，其他的都在setup里面用
beforeCreate -> use setup()
created -> use setup()
beforeMount -> onBeforeMount
mounted -> onMounted
beforeUpdate -> onBeforeUpdate
updated -> onUpdated
beforeDestroy -> onBeforeUnmount
destroyed -> onUnmounted
errorCaptured -> onErrorCaptured
V2的父组件和子组件生命周期钩子函数执行顺序可以归类为以下 4 部分：
加载渲染过程父 beforeCreate -> 父 created -> 父 beforeMount -> 子 beforeCreate -> 子 created -> 子 beforeMount -> 子 mounted -> 父 mounted
子组件更新过程父 beforeUpdate -> 子 beforeUpdate -> 子 updated -> 父 updated
父组件更新过程父 beforeUpdate -> 父 updated
销毁过程父 beforeDestroy -> 子 beforeDestroy -> 子 destroyed -> 父 destroyed
3.slot
可以绑定数据的插槽，显示内容完全由子组件决定，数据来自子组件。
如果绑定数据太多，而你不需要全都用到的时候可以使用es6的对象解构，关于对象解构比较简单。
作用域插槽：在slot上面绑定数据
作用域插槽绑定了一套数据，父组件可以拿来用。情况就变成了这样：样式父组件说了算，但内容可以显示子组件插槽绑定的。
4.VueX
State：定义了应用状态的数据结构，可以在这里设置默认的初始状态。
Getter：允许组件从 Store 中获取数据，mapGetters 辅助函数仅仅是将 store 中的 getter 映射到局部计算属性。
Mutation：是唯一更改 store 中状态的方法，且必须是同步函数。
Action：用于提交 mutation，而不是直接变更状态，可以包含任意异步操作。
Module：允许将单一的 Store 拆分为多个 store 且同时保存在单一的状态树中。
4.路由
1、路由的模式
hash模式：通过#号后面的内容的更改，触发hashchange事件，实现路由切换
history模式：通过pushState和replaceState切换url，触发popstate事件，实现路由切换，需要后端配合
abstract : 支持所有 JavaScript 运行环境，如 Node.js 服务器端。如果发现没有浏览器的 API，路由会自动强制进入这个模式.
2、路由解析
多个路由解析为同一个Vue组件。问题是，Vue出于性能原因，默认情况下共享组件将不会重新渲染，如果你尝试在使用相同组件的路由之间进行切换，则不会发生任何变化。
如果依然想重新渲染，怎么办呢？可以使用key <router-view :key="$route.path"></router-view>
noCache: true 不缓存每次都刷新
5.跨域
1、跨域解决方案
通过jsonp跨域
document.domain + iframe跨域
location.hash + iframe
window.name + iframe跨域
postMessage跨域
跨域资源共享（CORS）
nginx代理跨域（常用）可在nginx的静态资源服务器中加入配置
nodejs中间件代理跨域 利用node + webpack + webpack-dev-server代理接口跨域
WebSocket协议跨域 WebSocket protocol是HTML5一种新的协议。它实现了浏览器与服务器全双工通信，同时允许跨域通讯，是server push技术的一种很好的实现。
6.Vue项目进行哪些优化
1、代码层面的优化
v-if 和 v-show 区分使用场景
computed 和 watch 区分使用场景
v-for 遍历必须为 item 添加 key，且避免同时使用 v-if
长列表性能优化
事件的销毁
图片资源懒加载
路由懒加载
第三方插件的按需引入
优化无限列表性能
显示大量数据时使用 Vue 虚拟滚动条 npm install vue-virtual-scroller
服务端渲染 SSR or 预渲染
2、Webpack 层面的优化
Webpack 对图片进行压缩
减少 ES6 转为 ES5 的冗余代码
提取公共代码
模板预编译
提取组件的 CSS
优化 SourceMap
构建结果输出分析
Vue 项目的编译优化
3、基础的 Web 技术的优化
开启 gzip 压缩
浏览器缓存
CDN 的使用
使用 Chrome Performance 查找性能瓶颈
