初识vue2

1.生命周期函数

1.1 什么是生命周期函数

我理解的生命周期函数就是 vue 实例从创建到销毁的过程中，到了某一个特定的时间节点会自动触发的钩子函数 常用的钩子函数一共有八个

beforeCreate 创建前 实例还未创建

created 创建后 这个第一个能拿到 date 和 methods 来用的钩子函数

beforeMount 挂载前 挂载的是节点

mounted 挂载后 以上四个是创建阶段的钩子函数 这些钩子函数只会执行 1 次

beforeUpdate 数据变了视图未更新

updated 数据变了 视图更新 更新阶段的钩子函数会执行 0 次或者无数次

beforeDestory 销毁之前 最后一个能使用 data 和 methods 的钩子函数

destoryed 销毁之后 销毁阶段的钩子函数 执行 1 次

除了这八个还有

内置组件keep-alive里有俩分别是：

actived 激活缓存组件

deactived 停用缓存组件

最后一个是子组件的

errorCaptured 子组件出错的时候触发

1.2 在项目开发过程中哪些钩子函数用的比较多

一般请求数据我们用created生命周期函数（vue的生命周期函数又俗称vue钩子函数）比较多，因为created钩子函数是vue实例刚创建成功后，现在是最早能拿到data数据的时候，当然 mounted也可以去请求数据 也可以拿到data数据   但是区别是，mounted是vue实例挂载后才触发的，说白点就是dom元素现在才能拿得到，相比较着created要晚的多，当然 如果你是用ECharts图表的话，那么请求数据什么的就可以用mounted了 ， 因为ECharts图表需要先获取dom节点，再去渲染数据，所以，用那个钩子函数取决于你要用来做什么 ，什么东西都不是一成不变的，就比如 nextTick 这个方法，用它可以来延迟回调函数，使用nextTick方法可以在created里拿到dom节点，可以理解为把同步代码变成异步来执行

1.3 父组件和子组件的生命周期函数的执行顺序

父组件的创建前

父组件的创建后

父组件的挂载前

子组件的创建前

子组件的创建后

子组件的挂载前

子组件的挂载后

父组件的挂载后

2.nextTick

在 dom 更新之后执行的延迟回调 ，在 vue 中 dom 的更新是异步的，我理解的 nextTick 是把本身同步的代码变成异步执行，排在 dom 更新之后，所以能拿到 dom 节点

3.vuex

3.1 什么是 vuex 能解决什么问题

vuex 是 vue 的状态管理工具，能解决组件之间数据共享的问题

3.2 五大核心以及怎么调用

state 存放数据的地方 this.$store.state.xxx

mutations 修改state的地方 this.$store.commit()

getters 计算 state 的地方 this.$store.getters.xxx

actions 发送异步请求的地方 this.$store.dispatch()

modules 模块化 把数据分模块管理

3.3 vuex 的语法糖辅助函数

mapState mapMutations mapActions mapGetters

先引入 然后展开使用 mapState 和 mapGetters 在计算属性下展开 mapActions 和 mapMutations 在 methods 下展开 展开的时候用扩展运算符...展开

3.4 vuex 的执行机制

如果要修改 state，先通过 dispatch 调用一个 action 再在 action 里通过 commit 调用一个 mutations 修改 state

3.5 vuex 的弊端

不过 vuex 也有⼀些弊端,⽐如浏览器刷新的时候,vuex 的数据会丢失,我们⼀般结合本地存储来解决,当我们在 mutations ⾥⾯改变 state 的时候在通过 localStorage 或者 sessionStorage 或者持久化插件存储到本地,然后在 state 的状态的属性值那块写⼀个三元表达式,如果本地存 在数据的话则读取本地存储的数据,否则就赋值为 null 具体存了本地存储怎么拿来用：

在state中;
// list:JSON.parse(localStorage.getItem("list"))||[],
list: localStorage.getItem("list") ? JSON.parse(localStorage.getItem("list")) : [];

3.6 怎么开启严格模式

跟 state 同级的地方 设置 strict: false,

如果开启了严格模式 只能在 mutations 中修改 state 否则就会报错

3.7 modules

当在 vuex 中存储的数据很多的时候 需要用 modules 来分模块管理

首先新建一个模块的 js 文件

里面有四大核心 state mutations actions getters

并且要开启一个命名空间 namespaced:true

然后在 index.js 中引入 这个 js 并在 modules 中注册模块

用的时候 this.$store.state.a.arr 这就是调用模块a下面的arr this.$store.commit("a/add") 这个就是调用模块 a 下面的 add 方法

4. vue 路由有⼏种模式?有什么区别?原理是什么?(必问) 讲解

⾯试官您好,接下来我给您介绍⼀下 vue 的路由模式,vue 的路由模式⼀共有两种,分别是哈希和 history. 他们的区别是 hash 模式不 会包含在 http 请求当中,并且 hash 不会重新加载⻚⾯,⽽使⽤ history 模式的话,如果前端的 url 和后端发起请求的 url 不⼀致的话,会 报 404 错误,所以使⽤ history 模块的话我们需要和后端进⾏配合. history 的原理就是利⽤ html5 新增的两个特性⽅法,分别是 psuhState 和 replaceState 来完成的. 以上就是我对 vue 路由模式的理解.