前端必问面试题?vue知识?

1.vue组件通信?eventBus 讲解?

父传子

首先在使用子组件的标签上 通过自定义属性传递变量 在子组件中 通过 props 接受
在接收的时候有两种接收方式 数组形式 和 对象形式 对象形式可以规定传来的变量的数据类型(type)默认值(default)以及是否必填(required)

子传父

首先在使用子组件的标签上定义一个自定义事件 在子组件里通过 this.emit 方法的第一个参数是自定义事件的名字 第二个参数是就是子组件要传递给父组件的变量 最后在父组件接收使用就可以了

兄弟组件
利用中央事件总线 eventbus

在 main.js 中 把一个空的 vue 实例挂载在 vue 的原型上起名叫bus.on 方法接收。

2.nextTick⽅法有什么作⽤?

在 dom 更新之后执行的延迟回调
因为 vue 的 dom 更新是异步的 所以 当 dom 还未更新的时候我们无法拿到最新的 dom 来用
放在 nextTick 里的代码 就会在 dom 更新之后执行 就能拿到最新的 dom 来用了。

3.说⼀下什么是mvvm模式?

MVVM 是把 MVC 的 Controller 和 MVP 的 Presenter 改成了 ViewModel 。
View 的变化会⾃动更新到 ViewModel , ViewModel 的变化也会⾃动同步到 View 上显示。这种⾃动
同步是因为 ViewModel 中的属性实现了 Observer ,当属性变更时都能触发对应的操作。

4.vue双向数据绑定原理?

vue.js 则是采⽤ 数据劫持 结合 发布者-订阅者 模式的⽅式,
通过 Object.defineProperty() 来劫持各个属性的 setter , getter ,
在数据变动时发布消息给订阅者,触发相应的监听回调。
这个时候就可以实现数据的双向绑定。

5.常用的修饰符?

.trim 去除⾸尾多余的空格
.stop 阻⽌事件冒泡
.once 只渲染⼀次
.self 事件只作⽤在元素本身
.number 将值转化为 number 类型
.capter 组件之间捕获
.prevent 阻⽌元素的默认⾏为
.native 事件穿透,让我们可以在⾃定义组件上触发原生的事件

6.vue中常用的v-指令有那些呢?

v-text 元素的InnerText属性,必须是双标签
v-html 元素的innerHTML
v-if 判断是否插入这个元素
v-else-if
v-else
v-show 隐藏元素 如果确定要隐藏, 会给元素的style加上display:none
v-model 对于输入框实现数据的双向绑定

7.vue中key的作⽤是什么?

避免dom元素重复渲染. 我⻔⼀般在设置key的时候⾸先尽量会设置为id,或者index下表。
在列表渲染时使用key属性
使用key属性强制替换元素
更新组件时判断两个节点是否相同。相同就复用,不相同就删除旧的创建新,
提高渲染效率。

8.说⼀下你对keep-alive的理解?以及在项⽬中如何使⽤?

keep-alive 是 vue 内置的⼀个组件,⽽这个组件的作⽤就是能够缓存不活动的组件,我们能够知道,⼀般情况下,组件进⾏切
换的时候,默认会进⾏销毁,如果有需求,某个组件切换后不进⾏销毁,⽽是保存之前的状态,⽐如说刚刚填好的表单数
据。那么就可以利⽤ keep-alive 来实现
被缓存的组件 切换的时候不会触发创建和销毁的钩子函数 而是会触发跟 keep-alive 相关的 activated(激活) deactivated(停用)这两个钩子函数

keep-alive 标签 有 include 属性和 exclude 属性
include 属性 定义了要缓存谁
exclude 属性 定义了不缓存谁
还可以利用 路由的 meta 信息去规定缓存谁不缓存谁

我在写项目的过程中 可以使用 keep-alive 缓存刚刚填好的表单数据 还可以记录页面滚动条的距离,离开再回来滚动条还在这个位置

9.说⼀下什么是vue过滤器?

所谓的 vue 过滤器就是将数据进⾏⼆次处理,得到我们想要的结果数据
vue 的过滤器分为两种,第⼀种是全局过滤器,通过 vue.filter 来进⾏定义,第⼆种是局部过滤器,需要定义在组件内部,用 filters 过滤
项⽬中我们通过过滤器将后台返回的状态 0 和 1 转化为⽀付或者未⽀付 还有对时间格式进行过滤

vue3 中没有过滤器了

你可能感兴趣的:(前端必问面试题?vue知识?)