vue知识点大全【59题】

目录

1.vue数据驱动的理解

2.简述虚拟DOM

3.简述diff算法

4.说一下什么是mvvm模式

5.Vue组件中data为什么必须是一个函数？【考核知识点：对象作用域】

6.Vue中常见的指令有哪些？。【考核知识点：Vue的指令】

7.v-if和v-show的区别？以及使用场景

8.Vue怎么绑定事件？以及常用的事件修饰符【考核知识点：Vue的修饰符】

9.Vue中双向数据绑定是如何实现的【考核知识点：vue双向绑定原理】

10.Methods、 computed 、watch的区别

11.什么是过滤器？怎么定义全局和局部过滤器。【考核知识点：过滤器】

12.单页面应用和多页面应用区别以及优缺点

13.自定义指令有哪些参数

14.父传递子如何传递

15.子传递父如何传递

16.兄弟组件如何通信

17.Props验证类型都有哪些（8）

18.keep-alive是什么？keep-alive怎么使用

19.$nextTick的作用？【考核知识点：$nextTick】

20.组件的生命周期函数（11个），分别是什么意思

21.Vue-Router前端路由有哪几种模式【考核知识点：路由模式】

22.路由钩子函数共有几种？分别是什么？

23.路由钩子函数参数to、from、next分别是什么意思？

24.vue中$router和$route区别

25.有列表页进入到详情页的思路

26.Params和query的区别

27. 路由导航守卫的使用场景–

28.Element-ui的局部引入?【考核知识点：element-ui的使用】

29.Axios在vue中怎么使用

30.简述拦截器是什么，共有几个拦截点，分别是什么？【考核知识点：axios拦截器】

31.vue中如何解决跨域问题？

32.Vuex的五大核心及代表的意义？

33.详述Vuex运行机制

34.Vuex中如何异步修改数据

35.vuex如何实现持久化存储？。【考核知识点：vuex的持久化】

36.如何实现退出功能。【考核知识点：退出功能】

37.如何解决vue首屏加载过慢？

38.说一下你对slot插槽的理解?

39.在vue中使用echarts的步骤？。【考核知识点：vue中使用echarts】

40.简述promise

41.简述async await

42.简述js数据类型

43.什么是闭包

44.箭头函数和普通函数的区别

45.简述vuex及其使用

46.简述vue生命周期函数

47.vue常用的指令有哪些

48.vue常用的修饰符

49.vue中methods,computed,watch的区别

50.什么是nextTick

51.路由导航守卫有几种

52.路由有哪两种模式

53.keep-alive

54.简述axios封装的思路

55.简述vue的组件通讯

56.vue中data发⽣变化,视图不更新如何解决

57.说⼀下你对slot插槽的理解?

58.vue双向数据绑定原理

59.vue中key的作用

1.vue数据驱动的理解

这里的vue数据驱动的是视图，也就是DOM元素，指的是让DOM的内容随着数据的改变而改变

2.简述虚拟DOM

虚拟dom 是根据模板生成一个js对象,再根据这个js对象再去生成真实的dom，对复杂的文档DOM结构，进行最小化的DOM操作

3.简述diff算法

当data发生改变 会根据新的数据生成一个新的虚拟dom ，新的虚拟dom和旧的虚拟dom进行对比，这个对比的过程就是diff算法，会找到不同地方，只去渲染不同的地方

进行对比的时候，会返回一个 patch 对象，这个对象的作用是存储两个节点不同的地方，最后用 patch 里记录的信息去局部更新真实的 dom

4.说一下什么是mvvm模式

M modal v view vm viewModal

MVVM 是Model代表数据模型，数据和业务逻辑都在Model层中定义；View代表UI视图，负责数据的展示；ViewModel负责监听Model中数据的改变并且控制视图的更新，处理用户交互操作；

View 的变化会自动更新到 ViewModel ， ViewModel 的变化也会自动同步到 View 上显示。这种自动同步是因为 ViewModel 中的属性实现了 Observer ，当属性变更时都能触发对应的操作

5.Vue组件中data为什么必须是一个函数？【考核知识点：对象作用域】

js的数据类型 基本数据类型和引用数据类型

如果data是一个函数的话，这样每复用一次组件，就会返回一份新的data，类似于给每个组件实例创建一个私有的数据空间，让各个组件实例维护各自的数据。而单纯的写成对象形式，就使得所有组件实例共用了一份data，就会造成一个变了全都会变的结果。所以说vue组件的data必须是函数。这都是因为js的特性带来的，跟vue本身设计无关。

6.Vue中常见的指令有哪些？。【考核知识点：Vue的指令】

标红的必背

v-cloak 防止页面加载闪烁

v-html 可以把html的内容填充到标签中去

v-text 指令用于将数据填充到标签中，作用于插值表达式类似

v-pre 显示指令中原始信息，静态的内容不需要编译，可以加快渲染

v-once 执行一次性的插值【当数据改变时，插值处的内容不会继续更新】

v-on 用来进行事件的绑定

v-if    判断 是否创建或销毁dom元素

v-else   给 v-if 添加一个 "else" 块，必须跟在 v-if之后

v-show  是否显示/隐藏dom元素

v-for    循环

v-model  数据双向绑定

v-bind    动态绑定属性

7.v-if和v-show的区别？以及使用场景

v-if和v-show都是控制元素的显示与隐藏,

不过v-if控制元素的显示和隐藏的时候会创建或删除对应的dom元素,当每一个显示的时候,都会重新创建dom和渲染.

而v-show则是通过css的display来控制元素的显示与隐藏.

v-if比较耗费性能,所以我们涉及到频繁的显示/隐藏操作建议使用v-show,如果不是频繁操作的话,我们可以v-if

8.Vue怎么绑定事件？以及常用的事件修饰符【考核知识点：Vue的修饰符】

v-on：自定义事件名=”方法名”

@事件.stop  阻止事件冒泡

@事件.capture 设置事件捕获

@事件.prevent 阻止默认事件

@事件.once 事件执行一次

@事件.native 事件穿透

@事件.self事件作用在自身触发

9.Vue中双向数据绑定是如何实现的【考核知识点：vue双向绑定原理】

数据劫持结合“发布-订阅”模式的方式，通过Object.defineProperty（）的 set 和 get，在数据变动时发布消息给订阅者触发监听。

10.Methods、 computed 、watch的区别

Methods 存放方法的区域 调用一次，执行一次 不支持缓存 支持异步

Computed 计算属性 依赖值发生改变时会重新计算 支持缓存 不支持异步

Watch 监听 监听的数据发生改变时会触发 不支持缓存 支持异步

11.什么是过滤器？怎么定义全局和局部过滤器。【考核知识点：过滤器】

所谓的vue过滤器就是将数据进行二次处理,得到我们想要的结果数据

vue的过滤器分为两种,第一种是全局过滤器,通过vue.filter来进行定义,第二种是局部过滤器,需要定义在组件内部项目中我们通过过滤器将后台返回的状态0 和1 转化为支付或者未支付

12.单页面应用和多页面应用区别以及优缺点

单页面：只有一个html页面，跳转方式是组件之间的切换

优点：跳转流畅、组件化开发、组件可复用、开发便捷

缺点：首屏加载过慢

多页面：有多个页面，跳转方式是页面之间的跳转

优点：首屏加载块

缺点：跳转速度慢

13.自定义指令有哪些参数

指令钩子函数会被传入以下参数：

·el：指令所绑定的元素

binding：一个对象，

name：指令名，不包括 v- 前缀。

value：指令的绑定值

14.父传递子如何传递

 在子组件的标签上定义属性 子组件通过props来进行接收,可以通过数组的方式进行接收,也可以通过对象的方式来进行接收，如果通过对象的形式传递，可以使用default设置默认值

15.子传递父如何传递

子组件通过this.$emit("自定义事件",传递的数据), 父组件通过在子组件标签上监听自定义事件获取数据

16.兄弟组件如何通信

通过中央事件总线eventBus,

 1.创建一个空的js文件,导出一个vue实例

 2.传数据通过this.$bus.$emit（“自定义事件”，传递的数据）

 3.接数据通过this.$bus.$on(“自定义事件”, 处理函数)

17.Props验证类型都有哪些（8）

Number、boolean、string、object、array、function、date、symbol

18.keep-al