vue基础面试题

1.v-show和v-if区别

v-if是动态的向DOM树内添加或者删除DOM元素
v-show是通过设置DOM元素的display样式属性控制显示隐藏

2v-for中key的作用

key属性必须是唯一的标识,给key赋值的内容不能是可变的

3.vue中data为什么是function

data就是一个局部变量,即使使用同一个组件模板在html中使用多次,内部的data也互不影响,所以vue组件中的data必须是一个function

4.vue中双向绑定的原理

数据和视图同步,数据发生变化,视图跟着变化,视图变化,数据也随之发生改变

5.keep-alive的作用和被keep-alive声明的组件的生命周期

作用:keep-alive内部组件切换时,不需要重新创建组件实例,用于缓存内部组件实例

生命周期:activated：页面第一次进入的时候，钩子触发的顺序是created->mounted->activated

deactivated ：页面退出的时候会触发deactivated，当再次前进或者后退的时候只触发activated

6.说一下vue的生命周期，以及生命周期都做了什么事情?

vue 实例从创建到销毁的过程

从一个组件创建、数据初始化、挂载、更新、销毁,这就是一个组件的生命周期

7.vue什么时候 *** 作DOM比较合适? *** 作时发现有的组件获取不到，怎么办?

vue从mounted钩子函数开始可以获取和 *** 作dom

加上异步setTimeout，延迟获取dom的代码的执行

mounted不能保证所有子组件被挂载，因此需要使用Snexttick

8.发送网络请求在哪个函数中?

一般在created生命周期函数

mounted用于页面加载完成之后

9.vue组件间传值有哪些方式

父传子: 父组件通过数据绑定 , 子组件通过props属性继承父组件的值

子传父:父组件通过绑定事件 , 子组件通过$emit,传给父组件的事件名跟值

通过vuex进行传参

10.vue中改变数组内索引的值，数据不更新，如何处理

通过splice(Array.prototype.splice)实现

11.讲一下vuex

vuex是应用程序开发的状态管理模式 , 组件之间可以传参 , 可以实现单界面的状态管理到多页面状态管理

vuex的store中的state是响应式的 , 当state中的数据发生改变时 ,  vue组件会自动更新

12.如何获取dom?

通过ref="" , 用法是this.$refs.domName

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

单页面的优点 : 用户体验好 , 快 , 内容的改变不需要重新加载整个页面 , 前后端分离

单页面缺点 : 不利于seo , 初次加载时耗时多 , 页面复杂度提高很多

多页面 , 就是指一个应用中有多个页面 , 页面跳转时是整页刷新

14.vue生命周期第一次页面加载会触发哪几个钩子？

beforeCreate , created , beforeMount , mounted