vue-面试题

1、标题组件中的data为什么不是一个对象而是一个函数?

---

组件中的data写成一个函数，数据以函数返回值形式定义，这样每复用一次组件，就会返回一份新的data，类似于给每个组件实例创建一个私有的数据空间，让各个组件实例维护各自的数据。而单纯的写成对象形式，就使得所有组件实例共用了一份data，就会造成一个变了全都会变的结果。

---

2、 vue中第一次页面加载会触发哪几个生命周期钩子函数？

---

会触发下面这几个beforeCreate, created, beforeMount, mounted

---

3、vue.js的两个核心是什么？

---

数据驱动、组件系统

---

4、vue中 key 值的作用？

---

在v-for时使用，标识组件的唯一性，更好的区分组件，高效的更新虚拟DOM

---

5、v-show和v-if的区别？分别说明其使用场景

---

v-show 和v-if都是true的时候显示，false的时候隐藏 但是：false的情况下，v-show是采用的display:none;,v-if采用惰性加载。 如果需要频繁切换显示隐藏需要使用v-show

---

6、Vue中常用的修饰符有哪些？并简要说明它们的作用。

---

Stop：阻止冒泡； prevent：阻止默认事件； once：只执行一次； capture：将事件流设为捕获方式； self：直对自身触发事件； enter：回车键；Up:上； down：下；left:左；right：右；

---

7、过滤器的作用是什么？ 如何注册过滤器？ 如何使用过滤器？

---

作用: 对数据进行一些加工处理，比如 数字保留几位小数
// 全局注册
// console.log(Vue.filter);
// 定义：Vue.filter(‘过滤器名’,过滤器函数)
// 过滤器函数一定要有返回值
/*
Vue.filter(‘过滤器名’,functon(变量值,传入的参数){
// 过滤处理
return 处理后的结果
})
*/
// 局部注册：

    /*
        new Vue({
            el:""
            ...,
            filters:{
                过滤器名:function(变量值，传入的参数=参数默认值){
                    // 过滤处理
                     return  处理后的结果
                }
            }
        })


    */        

// 使用： {{ 变量 | 过滤器名 }}

---

8、Vue实例有哪些常见的配置选项，分别用来干嘛？

---

el 挂载的节点
data 数据
methods 事件方法
computed 计算属性
watch 监听器
components 局部组件
filters 过滤器
directives 自定义指令
生命周期钩子函数

---

9、vue中数组发生改变了，但是页面没有渲染，怎么办？

---

arr.splice()
Vue.set()
vm.$set()

---

10、组件中的data为什么不是一个对象而是一个函数?

---

组件中的data写成一个函数，数据以函数返回值形式定义，这样每复用一次组件，就会返回一份新的data，类似于给每个组件实例创建一个私有的数据空间，让各个组件实例维护各自的数据。而单纯的写成对象形式，就使得所有组件实例共用了一份data，就会造成一个变了全都会变的结果。