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