Vue 常问面试题（更新看心情*^▽^*）vue前端面试常问问题(^_−)☆ 如有错误请评论区指点(^_−)☆后续会继续

vue前端面试常问问题(^_−)☆

如有错误请评论区指点(^_−)☆

v-for优先于v-if （解析如下）
第一种<p v-for="child in childer" v-if="isFolder">{{child.tltle}}</p> 如果v-for和v-if二者同时使用。第一种每次渲染都会执行先循环后判断。无论循环多少次都无法避免。（不推荐，浪费性能）
第二种<template v-if="isFolder"><p v-for="child in childer">{{child.tltle}}</p></template>第二种情况就是在外层嵌套template，然后判读if条件，条件成立则渲染for循环，否则执行空函数。

这里主要探讨Vue代码层面的优化

内的图片先不做加载，等到滚动到可视区域后再去加载

vuex 介绍 Vuex 实现了一个单向数据流，在全局拥有一个 State 存放数据，当组件要更改 State 中的数据时，必须通过 Mutation 提交修改信息， Mutation 同时提供了订阅者模式供外部插件调用获取 State 数据的更新。而当所有异步操作(常见于调用后端接口异步获取更新数据)或批量的同步操作需要走 Action ，但 Action 也是无法直接修改 State 的，还是需要通过 Mutation 来修改State的数据。最后，根据 State 的变化，渲染到视图上。
vuex 中核心概念

state ： vuex 的唯一数据源，如果获取多个 state ,可以使用 ...mapState 。
getter : 可以将 getter 理解为计算属性， getter 的返回值根据他的依赖缓存起来，依赖发生变化才会被重新计算。
mutation ：更改 state 中唯一的方法是提交 mutation 都有一个字符串和一个回调函数。回调函数就是使劲进行状态修改的地方。并且会接收 state 作为第一个参数 payload 为第二个参数， payload 为自定义函数， mutation 必须是同步函数。
action ： action 类似 mutation 都是修改状态，不同之处,action 提交的 mutation 不是直接修改状态action 可以包含异步操作，而 mutation 不行action 中的回调函数第一个参数是 context ，是一个与 store 实例具有相同属性的方法的对象action 通过 store.dispatch 触发， mutation 通过 store.commit 提交
module ：由于是使用单一状态树，应用的所有状态集中到比较大的对象，当应用变得非常复杂是， store 对象就有可能变得相当臃肿。为了解决以上问题， vuex 允许我们将 store分割成模块，每个模块拥有自己的 state,mutation,action,getter ,甚至是嵌套子模块从上至下进行同样方式分割。

vuex 中数据存储localStorage vuex 是 vue 的状态管理器，存储的数据是响应式的。但是并不会保存起来，刷新之后就回到了初始状态，具体做法应该在 vuex 里数据改变的时候把数据拷贝一份保存到 localStorage 里面，刷新之后，如果localStorage 里有保存的数据，取出来再替换 store 里的 state 。注意：vuex 里保存的状态，都是数组，而localStorage 只支持字符串。