vue八股文8.0

330 阅读4分钟

vuex的核心概念理解?为什么要用vuex?

vuex应用核心就是store。store就是一个容器,包含了应用中大部分的state.

vuex是单向的数据流,组件不能直接修改Staste的状态。如果想要改变store中的状态就要用commit去提交mutation。(米忒神)

因为当我们用vue来开发一个页面的时候,经常会遇到组件之间的共享数据或者状态,需要通过props来传递一些数据,如果在应用规模比较小的时候,就可以用props常用的通信方式,但是当应用逐渐复杂之后,问题就出现了,如果还用这样的通信方式会导致数据变得很混乱。

vuev的原理?vuex和单纯的全局对象有什么区别?vuex和localStorage区别?

vuex会把全部组件的状态集中起来管理,所有数据操作必须通过action(啊神) - mutation - statechange来进行,再结合vue的数据视图双向绑定来实现页面的更新

vuex的状态储存是响应式的。当vue组件从store中读取状态的时候,如果store中的状态发生了改变,那么相应的组件也会高效更新。

区别:vuex中的数据是存储在内存当中的,页面刷新就会丢失,而localStorage是储存在本地计算机的,刷新并不会丢失数据。

vuex用于组件之间的传值,localStorage主要用于不同页面之间的传值。

vuex是全局变量存储,当刷新页面的时候vuex存储的数据就会丢失,而localStorage不会。

vuex的状态是一个对象或者数组使用需要注意什么?

因为对象或者数组是引用数据类型,复制后改变属性还是会影响原始数据,这样会改变state里面的状态,所以先用深度克隆复制对象,再修改。

vuex有哪几种属性?action和mutation的区别?为什么vuex的mutation中不能做异步操作?

分别是 State、 Getter、Mutation 、Action、 Module(妈着)

****区别:

mutation对象是vuex中唯一一个可以修改state状态的方式, mutation对象中方式必须是同步的,因为提交的 mutation触发是回调函数还没有被调用,那么数据的状态就无法准确知道是不是最新的。

action对象用于提交的是一个mutation事件,不可以修改数据的状态,action中的方法是异步的。

因为提交的 mutation触发是回调函数还没有被调用,那么数据的状态就无法准确知道是不是最新的。

mapGetters、mapMutations、mapActions 都是如何使用的?

mapGetters是state的辅助函数,也可以说是语法糖,当一个组件需要获取多个状态的时候,如果把这些状态都声明为计算属性就会有些重复,如果我们使用mapGetters辅助函数帮我们生成计算属性。

mapMutations辅助函数跟mapGetters一样,但不同的是mapMutations是把所有Mutations里面的方法映射为实例,methods里面的方法。

mapActions和mapMutations一样,它将actions里面的方法映射到methods

如何管理多个vuex数据仓库?

使用moduls模块划分和文件拆分来管理数据很多的问题 。

我们可以在moduls中进行模块划分,比如用户相关的放入user中, 文章信息相关模块放入article中

vuex做数据请求刷新页面,数据可能会发生丢失这个问题怎么解决?

· 把vuex中的数据存储到浏览器缓存中,可以用localStorage,缺点就是不安全,不适合大数据量的存储。

· 在页面刷新的时候再次请求远程数据,使动态更新vuex数据

· 在父页面向后台请求远程数据,并且在页面刷新前将vuex的数据先保存至sessionStorage(就是防止请求的数据量过大,然后加载页面的时候拿不到返回的数据)

localStorage -- 是永久存储在本地,除非你主动去删除;

sessionStorage -- 是存储到当前页面关闭为止,和其他tab页没关联;