谈谈你对vue.js框架的理解
MVVM:
MVVM是是Model-View-ViewModel的简写。即模型-视图-视图模型。
vue全家桶（vue/cli+vue-router+vuex）
vue-router：<router-link>和<router-view>和<keep-alive>
$route和 $router的区别是什么？
- router为VueRouter的实例，是一个全局路由对象，包含了路由跳转的方法、钩子函数等。
- route 是路由信息对象||跳转的路由对象，每一个路由都会有一个route对象，是一个局部对象，包含path,params,hash,query,fullPath,matched,name等路由信息参数。
vue-router的两种模式
- hash 原理是onhashchage事件，可以在window对象上监听这个事件
- history：利用了HTML5 History Interface 中新增的pushState()和replaceState()方法。需要后台配置支持。如果刷新时，服务器没有响应响应的资源，会刷出404，
路由动态传参：
路由地址后接 :参数, 参数会被this.$route.params接收
vue-router实现路由懒加载（动态加载路由）：
const router = new VueRouter({ routes: [ { path: '/home', name: 'Home'， component:() = import('../views/home') } ] })
vue - router有哪几种导航钩子？
- 全局前置守卫：
to:Route,代表要进入的目标，它是一个路由对象。
from:Route,代表当前正要离开的路由，也是一个路由对象
next:Function,必须需要调用的方法，具体的执行效果则依赖next方法调用的参数
- next():进入管道中的下一个钩子，如果全部的钩子执行完了，则导航的状态就是comfirmed（确认的）
- next(false):终端当前的导航。如浏览器URL改变，那么URL会充值到from路由对应的地址。
- next(’/’)||next({path:’/’}):跳转到一个不同的地址。当前导航终端，执行新的导航。
* next 方法必须调用，否则钩子函数无法resolved
后置钩子并没有next函数，也不会改变导航本身。
- 路由独享钩子
- beforEnter
- 组件内导航钩子
- beforeRouterEnter不能访问this，因为守卫在导航确认前被调用，因此新组建还没有被创建,可以通过传一个回调给 next 来访问组件实例。在导航被确认的时候执行回调，并把实例作为回调的方法参数。
Vuex：状态管理模式
- state，驱动应用的数据源；
- view，以声明方式将 state 映射到视图；
- actions，响应在 view 上的用户输入导致的状态变化。
五个核心方法：
- state（基本数据）、
- getters（从基本数据派生的数据）、
- mutations（提交更改数据的方法，同步）、
- actions（像一个装饰器，包裹mutations，使之可以异步）、
- modules（模块化Vue）
双向绑定即响应式原理：
Vue响应式底层实现方法是 Object.defineProperty() (vue3.0改成proxy)方法，该方法中存在一个getter和setter的可选项，可以对属性值的获取和设置造成影响
Vue中编写了一个wather来处理数据
在使用getter方法时，总会通知wather实例对view层渲染页面
同样的，在使用setter方法时，总会在变更值的同时，通知wather实例对view层进行更新
vue通信的几种方式
- props和$emit
- $parent 和 $children （另有：$root：获取根实例）
- provide / inject
- ref / refs
- vuex（状态管理器）
- localstorage和sessionStorage
虚拟dom（diff运算）:
用js对象结构表示DOM树的结构，形成真正的DOM树，当文档变更时，重新构造一棵DOM树，然后进行比较，记录差异， 把差异放在真正的DOM树上，更新真正的DOM树
作用：速度快，减小了页面渲染过程的次数