vlambda博客
学习文章列表

作者：「赫兹/Herzz」

Vue相关

1.Vue的核心是什么

Vue是一套构建用户界面的渐进式自底向上增量开发的MVVM框架，vue的核心只关注视图层，

核心思想：  

数据驱动（视图的内容随着数据的改变而改变）

组件化（可以增加代码的复用性，可维护性，可测试性，提高开发效率，方便重复使用，体现了高内聚低耦合）

2.请简述你对vue的理解

Vue是一套构建用户界面的渐进式的自底向上增量开发的MVVM框架，核心是关注视图层，vue的核心是为了解决数据的绑定问题，为了开发大型单页面应用和组件化，所以vue的核心思想是数据驱动和组件化，这里也说一下MVVM思想，MVVM思想是 模型  视图  vm是v和m连接的桥梁，当模型层数据修改时，VM层会检测到，并通知视图层进行相应修改

由于边幅有限，小编已经贴心地为大家将文档整理成pdf，可供大家打印，收藏。

文末有获取pfd的口令喔。

以上为目录的一部分

……

……

……

31.Vue组件中的data为什么是函数

Data是一个函数时，每个组件实例都有自己的作用域，每个实例相互独立，不会相互影响

如果是引用类型（对象），当多个组件共用一个数据源时，一处数据改变，所有的组件数据都会改变，所以要利用函数通过return返回对象的拷贝，（返回一个新数据），让每个实例都有自己的作用域，相互不影响。

32.Vue双向绑定的原理

Vue双向绑定就是：数据变化更新视图，视图变化更新数据

Vue数据双向绑定是通过数据劫持和观察者模式来实现的，

数据劫持，object.defineproperty它的目的是：当给属性赋值的时候，程序可以感知到，就可以控制改变属性值

观察者模式 当属性发生改变的时候，使用该数据的地方也发生改变

33.Vue中组件怎么传值

正向：父传子  父组件把要传递的数据绑定在属性上，发送，子组件通过props接收

逆向：子传父        子组件通过this.$emit（自定义事件名，要发送的数据），父组件设置一个监听事件来接收，然后拿到数据

兄弟：eventbus  中央事件总线

通过Vuex

34.Bootstrap的原理

网格系统的实现原理，通过定义容器大小，平分12份，（24份或者32份），再调整内外边距，结合媒体查询，就成了强大的响应式网格系统。

比如  row  col-xs-4

36.如果一个组件在多个项目中使用怎么办

37.槽口请简述

大概分这几点，首先槽口（插槽）可以放什么内容？放在哪？什么作用？可以放任意内容，在子组件中使用，是为了将父组件中的子组件模板数据正常显示。

具名插槽和匿名插槽，作用域插槽，说白了就是在组件上的属性，可以在组件元素内使用，

可以在父组件中使用slot-scope从子组件获取数据

38.Watch请简述

Watch的作用是监控一个值的变化，并调用因为变化需要执行的方法

39.Vant Ui请简述下

轻量、可靠的移动端 Vue 组件库

40.计算属性与watch区别

Computed  watch   区别就是computed的缓存功能，当无关数据数据改变时，不会重新计算，直接使用缓存中的值。计算属性是用来声明式的描述一个值依赖了其他的值，当所依赖的值后者变量发生变化时，计算属性也跟着改变，

Watch监听的是在data中定义的变量，当该变量变化时，会触发watch中的方法

41.mvvm框架是什么？它和其它框架（jquery）的区别是什么？哪些场景适合？

Mvvm和其他框架的区别是  vue数据驱动  通过数据来显示视图而不是节点操作

适用于数据操作比较多的场景

42.Vue首屏加载慢的原因，怎么解决的，白屏时间怎么检测，怎么解决白屏问题

首屏加载慢的原因：

第一次加载页面有很多组件数据需要渲染

解决方法：

1.路由懒加载  component：（）=>import(“路由地址”)

2.ui框架按需加载

3.gzip压缩

白屏时间检测：

？？？？

解决白屏问题：

①使用v-text渲染数据

②使用{{}}语法渲染数据，但是同时使用v-cloak指令（用来保持在元素上直到关联实例结束时候进行编译），v-cloak要放在什么位置呢，v-cloak并不需要添加到每个标签，只要在el挂载的标签上添加就可以

43.Vue双数据绑定过程中，这边儿数据改变了怎么通知另一边改变

数据劫持和观察者模式

Vue数据双向绑定是通过数据劫持和观察者模式来实现的，

数据劫持，object.defineproperty它的目的是：当给属性赋值的时候，程序可以感知到，就可以控制属性值的有效范围，可以改变其他属性的值

观察者模式它的目的是当属性发生改变的时候，使用该数据的地方也发生改变

44.Vuex流程

在vue组件里面，通过dispatch来触发actions提交修改数据的操作，然后通过actions的commit触发mutations来修改数据，mutations接收到commit的请求，就会自动通过mutate来修改state，最后由store触发每一个调用它的组件的更新

45.Vuex怎么请求异步数据

1.首先在state中创建变量

2.然后在action中调用封装好的axios请求，异步接收数据，commit提交给mutations

Mutations中改变state中的状态，将从action中获取到的值赋值给state

46.Vuex中action如何提交给mutation的

Action函数接收一个与store实例具有相同方法和属性的context对象，可以调用context.commit提交一个mutation，或者通过context.state和context.getters获取state和getters

47.Route与router区别

1.   router是VueRouter的一个对象，通过Vue.use(VueRouter)和VueRouter构造函数得到一个router的实例对象，这个对象中是一个全局的对象，他包含了所有的路由包含了许多关键的对象和属性。

2.route是一个跳转的路由对象，每一个路由都会有一个route对象，是一个局部的对象，可以获取对应的name,path,params,query等

49.vuex的State特性是？

State就是数据源的存放地

State里面的数据是响应式的，state中的数据改变，对应这个数据的组件也会发生改变

State通过mapstate把全局的state和getters映射到当前组件的计算属性中

50.vuex的Getter特性是？

Getter可以对state进行计算操作，它就是store的计算属性

Getter可以在多组件之间复用

如果一个状态只在一个组件内使用，可以不用getters

……

……

56.v-for与v-if优先级

首先不要把v-if与v-for用在同一个元素上，原因：v-for比v-if优先，如果每一次都需要遍历整个数组，将会影响速度，尤其是当之需要渲染很小一部分的时候。

v-for 比 v-if 具有更高的优先级

请写出饿了么5个组件

<el-alert>弹窗</el-alert>

<el-dialog>对话</el-dialog>

<el-calender>日历表</el-calender>

<el-progress:percentage="0">进度条<el-progrees>

<el-switch>开关</el-switch>

————————————————

原文链接：

https://blog.csdn.net/HanXiaoXi_yeal/article/details/112306277

口令

点击下面名片，在后台回复【vue面试】即可获得pdf

前端进阶学习圈

行业大牛“花果山技术团队”成员干货分享，行业热点解析、直播训练营、直播公开课、学习资源等，一键关注随时随地和行业大牛交流，快速提升技术能力、面试技巧，升职加薪快人一步！

0篇原创内容

Official Account

交易担保 抽奖助手 点我点我 Mini Program

点个在看你最好看