Vue中的生命周期
beforecreat：创建前，实例初始化之后，不能获取节点，data，watch，computed，methods均不能访问。
craeted：此阶段实例已经创建完成，data，watch，computed，methods均可以访问了，但是不建议在这里写的太多，这样会让白屏时间变长。此时未挂载DOM，不能访问DOM，如果需要访问，应该放在Vue.nextTick()回调函数中。
beforemount：挂载前，但是这时候已经创建了根元素
mounted：完成了DOM元素的挂载和渲染，这时候可以操作DOM或者向后端请求一些数据
beforeupdate：数据更新前，虽然这时候DOM里的数据更新了但是还没有渲染到网页中
upadted：这时候已经更新DOM完成了，可以操作更新后的DOM元素
actived和deactive：关于keep-alive标签，分别代表缓存前后。
beforeDestroy：组建销毁前，这里经常做提示是否销毁该组件。
destroyed：这时候是组件已经销毁了，里面的数据以及DOM已经无法访问了。
Vue响应式数据的原理？
将一个普通JavaScript对象传入实例化的Vue中data对象中，Vue将会遍历整个对象，并且用Object.denfineproperty来给每一个属性设置getter和setter，Vue内部会对数据进行劫持操作，采用观察者模式，当一个数据变化时随之改变的就称为这个数据的订阅者，当数据变化时，观察者会将变化发布，订阅者会接受，也就随之改变。Vue3中使用的是proxy。
proxy和defineproperty的优缺点
1.Object.defineProperty无法监控到数组下标的变化，导致直接通过数组的下标给数组设置值，不能实时响应。
2.Object.defineProperty只能够劫持数据的属性，每一次都需要遍历➕递归才能够对data数据中进行完整的监控。proxy只需要传入一个对象即可，并且也会返回一个新的对象。
3.proxy拦截的api比较多。
4.Object.defineProperty兼容性较好。
Vue中组件通信的方式
1.props，子组件接受父组件传来的数据，$emit，向父组件发送数据。
2.vuex公共状态管理，将数据存在vuex中。
3.child向子组件传递数据
4.父组件通过v-model向子组件传递数据，子组件通过this.$emit(‘绑定的标签名称',val)
5.localstorage和sessionstorage
（不常用）
6.listeners
7.中央事件总线
8.provide和inject
computed和watch的区别
computed：
1.常应用于多对一或者一对一的数据。
2.支持缓存。
3.不支持异步操作。
watch：
1.不支持缓存。
2.应用于一对多，当一个数据产生改变时处罚一系列条件。
3.函数有两个参数，分别为改变之前的值和改变之后的值。
4.函数有两个属性，immediate表示为组件加载立即回调函数，deep用来深度监听对象内的变化。
组件中data为什么是一个函数
在组件复用时如果data是一个对象，会出现改变一个值其他的data对象同时改变，所以需要采用data返回一个对象做到互不干扰。
nextTick的实现原理
在网页加载时，在dom元素更新之后就会触发nextTick，具体应用于在created钩子函数时使用，因为created时期还没有产生dom元素，也可以使用在mounted钩子函数中，因为mounted钩子函数不会保证所有的子组件dom元素加载完毕，他只是会通知子组件应该加载，写在mounted中可以确保页面加载完毕之后操作dom元素。
keep-alive组件的了解
作用为让组件保持持久化，保持组件当前的状态，不会初始化组件，并且不会走vue中常规的生命周期钩子函数，需要使用自己单独的生命周期函数activated与deactivated。
activated：被keep-alive所包裹的组件重新渲染时触发；
deactivate：被keep-alive所包裹的组件被缓存时触发；
Vue性能优化（使用过的
1.代码层面优化
1.1 v-if和v-show使用场景：当需要频繁切换的时候使用v-show，两者区别于v-if每一次的切换都是一次重建，而v-show只是简单的CSS的display属性切换。
1.2 computed和watch的使用场景：当需要计算属性时使用computed，可以利用computed可以缓存的特性来节省内存；当需要观察值的变化或者是需要执行较大的操作或异步操作之类时使用watch。
1.3 当使用v-for时必须添加key，这样可以让Vue.js精准的找到需要的数据，并且避免与v-if同时使用，当同时使用时v-for的优先级比v-if高，遍历整个数组很影响速度。
1.4 将无用的事件销毁
1.5 图片懒加载
1.6 路由懒加载
1.7 第三方插件做到按需引入
2.webpack层优化
webpack对较小的图片做base64转码，较大的图片可以使用image-webpack-loader来压缩图片。
3 web技术优化
3.1 开启gzip压缩传输模式
3.2 对静态资源进行缓存
3.3 cdn的使用
vue-router
1.路由简介以及实现原理
hash模式：匹配url中#后的变化，根据#后hash值的不同，页面产生不同的变化，这样浏览器不会向服务器发送请求，也就不存在刷新。
history模式：类似于hash模式，html5新增加了popState，pushState，replaceState的api可以保证在url变化时不向服务器发送请求，也就实现了美观版的hash模式。
2.路由钩子函数
全局钩子函数：beforeEach，afterEach；
其中包含三个参数：from：来自哪一个路由；to：即将要访问的路由；next：进入下一步操作或者是钩子函数；
组件钩子函数：beforeRouterEnter（渲染该路由组件之前调用）,beforeRouterLeave（离开该组件路由，beforeRouterUpdate（原组件被复用且动态参数改变时调用该钩子函数）
路由传值：
1.将所需要传输的值放在url中，在配置路由时就需要将变量跟在path后，在使用时可以使用routerlink标签或是使用router.push。
2.传在router.push的params参数中，但是刷新页面之后就会消失。
3.传在router.push的query参数中，变量就会跟在url后。
v-if和v-for不能连用的原因
v-for的优先级比v-if高，当出现在同一个标签时，首先vue会循环，之后再一个一个的去判断v-if表达式返回值是否为true，这样会消耗大量性能。
vue中使用箭头函数
在vue中使用箭头函数有以下好处：
1.写法相比较于普通函数较为简洁
2.可以省略return
3.在箭头函数中this指向当前vue
vue中祖孙组件通信
使用props将祖父组件的值传给子组件，子组件再使用props传递给孙组件。
slot
vue中v-model的原理
v-model是一个vue中的一个语法糖，即在标签中绑定了数据，也做到了数据监听。
slot插槽的使用
在父组件中子组件标签内使用带有slot属性的div标签，并且设置slot标签的值；
在子组件中设置slot标签，并且对应于父组件div标签中slot属性的名字；
