vue面试题之二：路由 vue-router 面试题

2. vue路由面试题

1. mvvm框架是什么？

mvvm即Model-View-ViewModel，mvvm的设计原理是基于mvc的

MVVM是Model-View-ViewModel的缩写，Model代表数据模型负责业务逻辑和数据封装，View代表UI组件负责界面和显示，ViewModel监听模型数据的改变和控制视图行为，处理用户交互，简单来说就是通过双向数据绑定把View层和Model层连接起来。在MVVM架构下，View和Model没有直接联系，而是通过ViewModel进行交互，我们只关注业务逻辑，不需要手动操作DOM，不需要关注View和Model的同步工作

2. vue-router是什么？有哪些组件？

• Vue Router 是 Vue.js 官方的路由管理器。它和 Vue.js 的核心深度集成，让构建单页面应用变得易如反掌。
• <router-link>和<router-view>和<keep-alive>

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

active-class是router-link终端属性，用来做选中样式的切换，当router-link标签被点击时将会应用这个样式

4. 怎么定义vue-router的动态路由？怎么获取传过来的值？

• 动态路由的创建，主要是使用path属性过程中，使用动态路径参数，以冒号开头，如下：

{
   
  path: '/details/:id'
  name: 'Details'
  components: Details
}

访问details目录下的所有文件，如果details/a，details/b等，都会映射到Details组件上。

• 当匹配到/details下的路由时，参数值会被设置到this.$route.params下，所以通过这个属性可以获取动态参数

console.log(this.$route.params.id)

5. vue-router有哪几种导航钩子？

• 全局前置守卫

const router = new VueRouter({
   })
router.beforeEach((to, from, next) = {
   
  // to do somethings
})

• to:Route,代表要进入的目标，它是一个路由对象。

• from:Route,代表当前正要离开的路由，也是一个路由对象

• ne