vue面试题总结

什么是MVVM？

MVVM 是 Model-View-ViewModel 的缩写。mvvm 是一种设计思想。

• Model 层表明数据模型，也能够在 Model 中定义数据修改和操做的业务逻辑；
• View 表明 UI 组件，它负责将数据模型转化成 UI 展示出来;
• ViewModel 是一个同步 View 和 Model 的对象。

MVVM和MVC的区别？

主要就是 mvc 中 Controller 演变成 mvvm 中的 viewModel。
mvvm 主要解决了 mvc 中大量的 DOM操做使页面渲染性能下降,加载速度变慢，影响用户体验。和当 Model 频繁发生变化，开发者须要主动更新到 View 。

Vue实现数据双向绑定的原理？

采用数据劫持结合发布者-订阅者模式的方式，经过 Object.defineProperty() 来劫持各个属性的setter，getter，在数据变更时发布消息给订阅者，触发相应监听回调。

VUE的优势?

低耦合、可重用性、独立开发、可测试

生命周期的做用?

便于在控制整个Vue实例的过程时更容易造成好的逻辑。

生命周期的渲染过程？

beforeCreate(建立前):在数据观测和初始化事件还未开始
created(建立后):完成数据观测，属性和方法的计算，初始化事件，$el属性还没显示出来
beforeMount():编译模板，把data里面的数据和模板生成html，可是html还没挂载到页面
mounted():编译好的html内容替换el属性指向的DOM对象，完成html渲染到页面。此过程当中执行ajax交互
beforeUpdate():数据更新前调用，发生在虚拟DOM从新渲染和打补丁以前，可在该钩子函数中进一步的更改状态，不会触发附加的重复渲染过程
updated():在犹豫数据更改致使的虚拟DOM从新渲染和打补丁以后调用
beforeDestory():在实例销毁以前调用，此时实例仍然彻底可用
destoryed():实例销毁后调用，全部事件监听器会被移除，全部的自实例也会被销毁。服务器端渲染期间不被调用

vue-router是什么？有哪些组件？有哪些导航钩子函数？

定义：写路由的一个组件
组件：router-link、router-view
钩子函数：全局导航钩子、组件内导航钩子、单独路由独享组件

参数传递方式？

• 父组件传递给子组件：

子组件经过props接受数据

• 子组件传递给父组件：

$emit方法传递参数

• 兄弟组件传值：

eventBus，建立一个事件中心，至关于中转站, 用它来接收和传递事件。

父子兄弟组件调用对方组件的方法

• 子组件调用父组件的方法：

一、子组件调用父组件可使用this.$parent.方法名

二、子组件里面用$emit向父组件触发一个事件，父组件监听这个事件就好了。

三、父组件把方法传入子组件中，在子组件里像接受数据同样接收，直接调用这个方法

• 父组件调用子组件的方法:

经过ref直接调用子组件的方法：eg:this.$refs.refName.子组件的方法名。

• 兄弟组件相互调用他们的方法：

借助父组件，先调用父组件的方法，用父组件去调用另外一个子组件的方法。

VUE和其余框架的区别

• 和REACT的区别：

• 相同点：

react采用特殊的jsx的语法，而vue也推崇写.vue的特殊文件格式。
对文件内容都有必定的约定，二者都须要编译后使用，
中心思想都是一切都是组件，组件实例之间能够嵌套，
都提供合理的钩子函数，让开发者定制化的处理需求，
都不内置AJAX，Route等功能到核心包，而是以插件的加载，
在组件开发中都支持mixins的特性

• 不一样点：

react采用的虚拟DOM会对渲染出来的结果作赃检查；
vue在模板中提供了指令、过滤器等，能够快捷方便的操做虚拟DOM

• 和ANGULAR的区别：

• 相同点：

都支持指令，包括内置指令和自定义指令；
都支持过滤器，包括内置过滤器和自定义过滤器；
都支持数据的双向绑定，都不支持低端浏览器；

• 不一样点：

angular的学习成本比较高，而vue的API比较简单直观；
angular对数据作赃检查，因此watch越多越慢；
vue使用基于依赖追踪的观察而且使用异步队列更新，全部数据都是独立触发的。

• 和JQuery的区别：

• jQuery是使用选择器（$）选取DOM对象，对其进行赋值、取值、事件绑定等操做，其实和原生的HTML的区别只在于能够更方便的选取和操做DOM对象，而数据和界面是在一块儿的。
• Vue则是经过Vue对象将数据和View彻底分离开来了。对数据进行操做再也不须要引用相应的DOM对象，能够说数据和View是分离的，他们经过Vue对象这个vm实现相互的绑定。

怎么定义vue-router的动态路由？怎么获取传过来的动态参数？

在router目录下的index.js文件中，对path属性加上/:id。 使用router对象的params能够获取ID

vue.cli怎么使用自定义的组件？有遇到过哪些问题吗？

一、建立.vue文件
二、import引入，component里面定义
三、template使用。

封装vue组件的过程？

一、创建组件的模板；
二、准备好组件的数据输入；
三、准备好组件的数据输出；
四、调用。

router有什么区别？

$route是“路由信息对象”，包括path，params，hash，query，fullPath，matched，name等路由信息参数。

$router是“路由实例”对象包括了路由的跳转方法，钩子函数等。

watch和computer有什么区别?

computer: 当页面中有某些数据依赖其余数据进行变更的时候使用;

watch: watch和computed很类似，watch用于观察和监听页面上的vue实例，固然在大部分状况下咱们都会使用computed，但若是要在数据变化的同时进行异步操做或者是比较大的开销，那么watch为最佳选择

Vuex的几种属性？

state、getter、mutation、action、module

• state:页面状态管理容器对象
• getter:state的计算属性
• mutation:状态改变操做方法
• action:操做行为处理模块
• module:store能够切分红模块，每一个模块都拥有本身的state,getter,mutation,action

嵌套路由怎么定义？

VueRouter 的参数中使用 children 配置

active-class 是哪一个组件的属性？

vue-router 模块的 router-link 组件。