vue新一轮的面试题

简介: vue新一轮的面试题

1. 在vue中watch和created哪个先执行?为什么?


在wacth监控数据时,设置immediate:true;会优先执行watch,created后执行;反之则反


2. 在使用计算属性的时,函数名和data数据源中的数据可以同名吗?


不可以,同名会报错:The computed property "xxxx" is already  


不可以,因为初始化vm的过程,会先把data绑定到vm,


再把computed的值绑定到vm,会把data覆盖了。


3. 我对重排的定义:


重排(回流):当render树中的一部分或者全部,


因为大小边距等问题发生改变,而需要DOM树重新计算的过程叫做:重排(回流)。


v-show指令其原理就是改变display涉及到了DOM结构的改变。


所以放生了重排。


4. 在vue项目中穿透符有哪些?


普通的css使用    >>>


scss使用       ::v-deep


less使用      /deep/  


5. vue-loader在webpack编译流程中的哪个阶段?


编译模板阶段:从入口文件出发,调用所有配置的Loader的模块进行编译,


再找出该模块依赖的模块,再递归本步骤,直到所有入口依赖的文件,都经过了本步骤的处理


6. v-if和v-show哪个优先级更高? 你去看一下


我来解释:if>show


还有一种说没有优先级


7. vue的v-for如何倒序输出?


1. 先把数组做一层reverse()倒叙处理,然后在执行v-for


2. 使用css3 flex 容器的 order


8. axios同时请求多个接口,如果当token过期时,怎么取消后面的请求?


axios的话可以使用cancelToken来实现。如果是原生的XMLhttprequest的话,需要使用abort()方法实现。


9.你知道vue的模板语法用的是哪个web模板引擎的吗 说说你对这模板引擎的理解


用了Mustache模板引擎


vue的.sync 修饰符可以用表达式吗?


不可以


你知道style加scoped属性的用途和原理吗?


用途:scoped会在元素上添加唯一的属性(data-v-x形式),


css编译后也会加上属性选择器,在标签上绑定了自定义属性,


防止css全局污染


如何在子组件中访问父组件的实例?


this.$parent拿到父组件实例


this.$children拿到子组件实例(数组)


vue中如果父组件想调用子组件的方法,可以在子组件中加上ref,然后通过


this.$refs.ref.method调用(https://www.cnblogs.com/jin-zhe/p/9523029.html)


Vue中子组件调用父组件的方法,这里有三种方法提供参考:


1:直接在子组件中通过this.$parent.event来调用父组件的方法


2:在子组件里用$emit向父组件触发一个事件,父组件监听这个事件


3:父组件把方法传入子组件中,在子组件里直接调用这个方法


https://www.cnblogs.com/jin-zhe/p/9523782.html


watch的属性用箭头函数定义结果会怎么样?


因为箭头函数默绑定父级作用域的上下文,所以不会绑定vue实例,所以 this 是undefind


你有使用过babel-polyfill模块吗?主要是用来做什么的?


ES6的转码。IE的兼容


babel默认只转换语法,而不转换新的API,


如需使用新的API,


还需要使用对应的转换插件或者polyfill去模拟这些新特性。


Babel默认只转换新的JavaScript句法(syntax),而不转换新的API,比如Iterator、

Generator、Set、Maps、Proxy、Reflect、Symbol、Promise等全局对象,以及一些定义在全局对象上的方法(比如Object.assign)都不会转码。


举例来说,ES6在Array对象上新增了Array.from方法。


Babel就不会转码这个方法。如果想让这个方法运行,


必须使用babel-polyfill,为当前环境提供一个垫片。


currentTarget:事件绑定的元素


target:鼠标触发的元素


event.currentTarget指向事件所绑定的元素,而event.target始终指向事件发生时的元素。


在.vue文件中style是必须的吗?那script是必须的吗?为什么?


试验了下,在 .vue 文件中,template是必须的,而script与style都不是必须的。


vue怎么实现强制刷新组件?


this.$forceUpdate()
//模版上绑定key
<SomeComponent :key="theKey"/>
//选项里绑定data
data(){
  return{
      theKey:0
  }
}
//刷新key达到刷新组件的目的
theKey++;


vue变量名如果以_、$开头的属性会发生什么问题?怎么访问到它们的值?


报错 变量未定义


以 _ 或 $ 开头的属性 不会 被 Vue 实例代理,因为它们可能和 Vue 内置的属性、API 方法冲突。


你可以使用例如 $data.xxx或者_data.xxx 的方式访问这些属性。


在vue中created与activated有什么区别?


vue中mixins和extends有什么区别?


讲讲你对 sync修饰符的理解


Vue.observable你有了解过吗?说说看


vue中怎么重置data?


说说你对vue的错误处理的了解?


在vue事件中传入$event,使用e.target和e.currentTarget有什么区别?


说下$attrs和$listeners的使用场景 #461


使用


普通的css使用


<style scoped>
>>> .disanfangclass {
  color: gray;
}
</style>
scss使用
<style lang="scss" scoped>
::v-deep .formatter-text {
  color: red;
}
</style>
less使用  
<style scoped lang="less">
  /deep/  img{
    width: 100px;
    height: 100px;
  }
</style>
相关文章
|
JavaScript 前端开发 应用服务中间件
【Vue面试题三十】、vue项目本地开发完成后部署到服务器后报404是什么原因呢?
这篇文章分析了Vue项目在服务器部署后出现404错误的原因,主要是由于history路由模式下服务器缺少对单页应用的支持,并提供了通过修改nginx配置使用`try_files`指令重定向所有请求到`index.html`的解决方案。
【Vue面试题三十】、vue项目本地开发完成后部署到服务器后报404是什么原因呢?
|
JavaScript
【Vue面试题十五】、说说你对slot的理解?slot使用场景有哪些?
这篇文章深入探讨了Vue中的`slot`概念,包括它的定义、使用场景和分类(默认插槽、具名插槽和作用域插槽),并通过代码示例展示了如何在组件中使用插槽来实现内容的分发和自定义。同时,文章还对插槽的工作原理进行了分析,解释了`renderSlot`函数和`$scopedSlots`对象的角色。
【Vue面试题十五】、说说你对slot的理解?slot使用场景有哪些?
|
JavaScript 前端开发
【Vue面试题二十五】、你了解axios的原理吗?有看过它的源码吗?
这篇文章主要讨论了axios的使用、原理以及源码分析。 文章中首先回顾了axios的基本用法,包括发送请求、请求拦截器和响应拦截器的使用,以及如何取消请求。接着,作者实现了一个简易版的axios,包括构造函数、请求方法、拦截器的实现等。最后,文章对axios的源码进行了分析,包括目录结构、核心文件axios.js的内容,以及axios实例化过程中的配置合并、拦截器的使用等。
【Vue面试题二十五】、你了解axios的原理吗?有看过它的源码吗?
|
JavaScript 前端开发 数据处理
【Vue面试题二十八】、vue要做权限管理该怎么做?如果控制到按钮级别的权限怎么做?
这篇文章讨论了Vue中实现权限管理的策略,包括接口权限、路由权限、菜单权限和按钮权限的控制方法,并提供了不同的实现方案及代码示例,以确保用户只能访问被授权的资源。
【Vue面试题二十八】、vue要做权限管理该怎么做?如果控制到按钮级别的权限怎么做?
|
JavaScript 前端开发
【Vue面试题二十七】、你了解axios的原理吗?有看过它的源码吗?
文章讨论了Vue项目目录结构的设计原则和实践,强调了项目结构清晰的重要性,提出了包括语义一致性、单一入口/出口、就近原则、公共文件的绝对路径引用等原则,并展示了单页面和多页面Vue项目的目录结构示例。
|
缓存 JavaScript 前端开发
vue面试题
vue面试题
264 64
|
JavaScript 安全 前端开发
【Vue面试题二十九】、Vue项目中你是如何解决跨域的呢?
这篇文章介绍了Vue项目中解决跨域问题的方法,包括使用CORS设置HTTP头、通过Proxy代理服务器进行请求转发,以及在vue.config.js中配置代理对象的策略。
【Vue面试题二十九】、Vue项目中你是如何解决跨域的呢?
|
JavaScript 前端开发
vue尚品汇商城项目-day01【8.路由跳转与传参相关面试题】
vue尚品汇商城项目-day01【8.路由跳转与传参相关面试题】
131 0
vue尚品汇商城项目-day01【8.路由跳转与传参相关面试题】
|
JavaScript 前端开发 编译器
【Vue面试题三十二】、vue3有了解过吗?能说说跟vue2的区别吗?
这篇文章介绍了Vue 3相对于Vue 2的改进和新增特性,包括性能提升、体积减小、更易维护、更好的TypeScript支持、新的Composition API、新增的Teleport和createRenderer功能,以及Vue 3中的非兼容性变更和API的移除或重命名。
【Vue面试题三十二】、vue3有了解过吗?能说说跟vue2的区别吗?
|
JavaScript 前端开发 API
【Vue面试题三十一】、你是怎么处理vue项目中的错误的?
这篇文章讨论了Vue项目中错误的处理方式,包括后端接口错误和代码逻辑错误的处理策略。文章详细介绍了如何使用axios的拦截器处理后端接口错误,以及Vue提供的全局错误处理函数`errorHandler`和生命周期钩子`errorCaptured`来处理代码中的逻辑错误。此外,还分析了Vue错误处理的源码,解释了`handleError`、`globalHandleError`、`invokeWithErrorHandling`和`logError`函数的作用和处理流程。
【Vue面试题三十一】、你是怎么处理vue项目中的错误的?

热门文章

最新文章