vue面试题，快看看
vue优点
双向数据绑定：在数据操作方面更为简单
组件化：组件的封装和复用，开发更高效
虚拟DOM：不再使用原生dom操作节点，原生dom操作非常耗性能
MVVM的理解
Model是模型层
View 是视图层
ViewModel 介于View和Model之间，起桥梁作用，使视图和数据既能够分离又能通信，View的变化能实时让Model发生变化，而Model的变化也能实时更新到View
vue原理
双向数据绑定
通过数据劫持，结合发布订阅模式的方式实现，达到数据和视图同步，数据发生变化，视图跟着变化，视图变化，数据也随之发生改变
虚拟DOM
用JavaScript对象来代替DOM节点
// 原始dom节点 <ul calss=‘myclass’> <li>初始文本</li> </ul> // 对象形式节点 let ul = { tag: ‘ul’, attrs: { class: ‘myclass’ }, children: [ tag: 'li', attrs: {}, children: ['初始文本'] ] } // 通过修改对象属性来修改视图 ul.children.children[0](‘修改后的文本’)
组件传值
父传子：
父组件中，用v-bind，绑定属性值，子组件通过props接收
子传父：
子组件通过$emit传值，父组件通过v-on绑定的事件接收
兄弟传值：
通过中间值，也是就在main.js文件里，new一个vue实例实现传值
Vuex的理解
是vue的状态管理器
State: 存放数据
Getters: 监听数据
Mutations: 提交更改数据的方法，同步
Actions: 像一个装饰器，包裹mutations，使之可以异步
Modules: 模块化vuex
mapState、mapGetters、mapActions
生命周期
创建前/后，载入前/后，更新前/后，销毁前/后
beforeCreated 创建前
created 创建后
beforeMount 载入前
mounted 载入后
beforeUpdate 数据更新前
updated 数据更新后
beforeDestory 实例销毁前
destroyed 实例销毁后
父子组件的生命周期顺序
渲染过程:
父beforeCreate->父created->父beforeMount->子beforeCreate->子created->子beforeMount->子mounted->父mounted
更新过程:
父beforeUpdate->子beforeUpdate->子updated->父updated
<keep-alive></keep-alive>的作用
是 vue内置组件，可以保留其包含的组件的状态，避免重新渲染
ref的作用
获取dom元素
获取子组件的data
调用子组件的方法
组件中key的作用
key是节点唯一标识，方便diff算法识别节点，高效更新虚拟dom
组件中name的作用
在dev-tools中使用，dev-tools中是以组件name进行显示的
配合keep-alive对组件缓存做限制
组件中data为什么必须是一个函数
写成函数，复用组件时，都会返回一份新的data，相当于每个组件都有私有的数据空间，各自维护数据，不会造成混乱。而写成对象形式，相当于所有组件共用一个data，会牵一发而动全身
$nextTick的使用
created() 钩子内进行的dom操作一定要放在vue.nextTick() 的回调函数中，created() 执行时dom实际并未渲染，此时进行dom操作是徒劳的，nextTick正好解决了这一问题
路由的模式
hash模式：即地址栏url中的#符号
history模式：利用了 html5中window.history新增的 pushState() 、replaceState() 方法
路由的导航钩子
全局导航钩子：router.beforeEach(to,from,next)，即路由守卫
组件内的钩子：beforeRouteEnter、beforeRouteUpdate、beforeRouteLeave
路由懒加载的实现方式
使用import，实现懒加载
webpack提供的方法，实现懒加载
路由传参方式
path后添加id
使用路由name匹配路由，通过params传递参数
使用path匹配路由，通过query传递参数
第一种方式，页面刷新参数会丢失，而其他两种不会
v-show、v-if的区别
v-show本质是控制样式的显示和隐藏
v-if是动态添加或者删除DOM元素，不停的销毁和创建更耗性能
less、scss申明变量方式
less用@符申明和使用变量
scss用$符申明和使用变量
