关于路由vue-router的vuejs面试题有哪些

  介绍

这篇文章主要介绍了关于路由vue-router的vuejs面试题有哪些,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获、下面让小编带着大家一起了解一下。

<强>路由vue-router面试题

<编辑> <强> 1。mvvm框架是什么?

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

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

<编辑> <强> 2。vue-router是什么?有哪些组件? <李>

Vue路由器是Vue。js官方的路由管理器。它和Vue。js的核心深度集成,让构建单页面应用变得易如反掌。

<李>

<代码> & lt; router-link> 和<代码> & lt; router-view> 和<代码> & lt; keep-alive>

<编辑> <强> 3。活动课是哪个组件的属性?

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

<编辑> <强> 4。怎么定义vue-router的动态路由?怎么获取传过来的值? <李>

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

{   ,,路径:& # 39;/细节/:id # 39;   ,,名字:& # 39;细节# 39;   组件:才能细节   }

访问细节目录下的所有文件,如果/细节,细节/b等,都会映射到细节组件上。

<李>

当匹配到/细节下的路由时,参数值会被设置到美元的路线。参数下,所以通过这个属性可以获取动态参数

console.log(这一点。route.params.id美元) <编辑> <强> 5。vue-router有哪几种导航钩子? <李>

全局前置守卫

const  router =, new  VueRouter ({})   router.beforeEach(下),,,,,=,{//,才能用do 运转   }) <李>

:路线,代表要进入的目标,它是一个路由对象。

<李>

:路线,代表当前正要离开的路由,也是一个路由对象

<李>

:函数,必须需要调用的方法,具体的执行效果则依赖一方法调用的参数

<李>

next():进入管道中的下一个钩子,如果全部的钩子执行完了,则导航的状态就是证实(确认的)

<李>

下(错误):终端当前的导航。如浏览器URL改变,那么URL会充值到从路由对应的地址。

<李>

下一个(“/?| |下一个({路径:'/'}):跳转到一个不同的地址。当前导航终端,执行新的导航。

<强> *下一方法必须调用,否则钩子函数无法解决了 <李>

全局后置钩子

router.afterEach ((,,),=, {   ,//用do 运转   }) <李>

后置钩子并没有下函数,也不会改变导航本身。

<李>

路由独享钩子

<李>

beforEnter

const  router =, new  VueRouter ({   路线:,才能   ,,,{   ,,,,,路径:,& # 39;/回家# 39;   ,,,,,组件:,,   ,,,,,beforeEnter:,(下),,,,,=,{   ,,,,,,,//用do 运转   ,,,,,,,//,参数与全局守卫参数一样   ,,,,}   ,,,}   ,,)   }) <李>

组件内导航钩子

const  Home =, {   ,,模板:& lt; div</div,   beforeRouteEnter才能(,,,,下一个){   ,,,//,在渲染该组件的对应路由被,confirm 前调用   ,,,//,不能获取组件实例,“这”,因为当守卫执行前,组件实例还没被创建   ,,},   beforeRouteUpdate才能(,,,,下一个){   ,,,//,在当前路由改变,但是该组件被复用时调用   ,,,//,例:对于一个动态参数的路径,/home/: id,在/home/1,和,/home/2,之间跳转的时候   ,,,//,由于会渲染同样的,Home 组件,因此组件实例会被复用,而这个钩子就会在这个情况下被调用。   ,,,//,可以访问组件实例,& # 39;这个# 39;   ,,},   beforeRouteLeave才能(,,,,下一个){   ,,,//,导航离开该组件的对应路由时调用   ,,,//,可以访问组件实例,& # 39;这个# 39;   ,,}   }

关于路由vue-router的vuejs面试题有哪些