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用$符申明和使用变量
标签：面试题,vue,dom,看看,视图,组件,数据,路由 来源： https://www.cnblogs.com/wx3091/p/12787930.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。