您当前的位置: 首页 > 技术文章 > 前端开发

2022最新前端vue面试题

作者: 时间:2022-05-27阅读数:人阅读

一.自我介绍

(我是谁 来自哪里,今天来的目的,面试的岗位是什么,几年的工作经验,掌握的技术栈有哪些,开发过什么项目,项目中负责的板块是什么)

面试官您好!我叫XXX,来自XXX,很荣幸能来我们公司面试,我从事前端开发有3年了,目前掌握的技术有html,css,js,ajax,vue,小程序,参与过各种类型的项目。
我做过的项目有 A,B,C,D,E 那么最近做的一个项目是XXX 在这个项目中我主要负责的板块是XXX 面试官 您这边还有什么想要了解的么。

二.项目功能提问

vue后台项目(这几个功能点要求都能用自己的话说出来)

1.路由守卫 / 导航守卫

既然是守卫,首先是对咱们后台页面访问的一层保护,如果我没有进行登陆过,后台的操作页面是不允许用户访问的
我们是用到vue路由中的一个钩子函数beforeEach,那么这个函数中有三个参数,分别是to from next
to是去哪里 from是从哪里来 next下一步说通俗点就是放行
主要逻辑是判断我们有没有登录,那么我们可以通过登录后获取到的token来判断 如果有token就直接next()放行
如果没有的前提下,我们再判断用户访问的页面是不是登陆页面吗,是的话就放行 不是就跳回登录页

token失效期,我们前端该如何处理。

2.权限路由/动态路由/鉴权

既然说到权限 那么肯定是根据不同账户得到不同的权限来做路由配置和菜单的渲染
第一点当我们登录之后会获取到当前账户的身份(权限),那么我们的路由配置实际上就是一个数组
我们要做的事情就是把获取到的身份与这个数组做对比,通过相关的计算筛选出最终匹配当前身份的路由配置
然后将计算出来的路由数组通过router.addRouters动态挂载
还要注意的一点就是需要将我们筛选出来的路由配置渲染到我们的前端页面上去一一相对应

3.拦截器:请求拦截 响应拦截

请求拦截:因为http是无状态的 无法保存我们的状态,那么我们就需要一个标识
当我们登录之后,后续的所有请求操作都需要携带我们这个token,所以我们统一把它添加到请求头当中,避免了
无意义请求

响应拦截:当设置了响应拦截后所有的响应都会经过它,所以方便我们统一处理响应数据做相关的操作

4.增 删 改 查(增加数据项)

这些操作都是针对与数据来进行操作
增:我们要增加一条数据或者多条数据,首先第一点我们需要获取到增加的数据,然后通过后台提供的相关接口,把数据作为参数传递,当后台拿到我的数据后往数据库中追加这些数据,然后将最新的数据响应给我们,之后再进行渲染

删:首先获取到要删除的这条数据唯一标识可能是ID 可能是code,然后通过后台提供的相关接口,把这个标识作为参数传递,当后台拿到后就会删除这个标识相对应的数据,然后将最新的数据响应给我们,之后再进行渲染

改:首先获取到要修改的这条数据唯一标识可能是ID 可能是code,然后前端进行数据改动,然后通过后台提供的相关接口,把数据作为参数传递,当后台拿到我的数据后往数据库中修改这个标识相对应的数据,然后将修改后的数据响应给我们,之后再进行渲染

查:不要参数, 不需要传递任何参数,直接调用接口获取所有数据
需要参数,首先第一点我们需要获取到需要查询的关键字然后通过后台提供的相关接口,把这些关键字作为参数传递,当后台拿到这个关键字把相对应的数据响应给我们,之后再进行渲染

5.axios的封装

为了方便使用我们进行了封装
首先我们封装一个get或者post的这些方法,然后通过返回一个promise对象进行使用
在promise中通过.then和.catch拿到axios请求结果
然后通过工具层将不同的业务版块需要调用的接口进行模块化再暴露出去
在我们的但页面中引入相对于的接口模块,然后调用,因为我们底层封装的是一个promise对象
所以我们可以通过ES7中的 async await直接拿到响应数据

三.移动端项目功能点(老师自行提问考察2-3个点)

四.小程序功能点(考察2-3个点)

五知识点提问:

1.vue常用指令有哪些?

v-for /v-bind(

本站所有文章、数据、图片均来自互联网,一切版权均归源网站或源作者所有。

如果侵犯了你的权益请来信告知我们删除。邮箱:licqi@yunshuaiweb.com

加载中~