关于vuex state可不通过指令而通过底层指针改变的问题

 前言:最近在写一个药店方面的购物车逻辑,我借助了vuex的store来对全局的商品、活动进行分module存储和操纵。具体的业务逻辑为如下,最后导致了state的指针紊乱,导致了state的值可以不通过vuex指令而进行更改。现代码总结和逻辑过程如下:


state指针紊乱产生的问题

详情代码如下:

在通过rootState获取所有活动的商品信息时,

最初我只是简单的const originGoodsList = commonGoods,

结果造成我的commonGoods在我每次提交数据对所有的数据汇聚在一起,筛选,去重,合并之后。


获取rootState里的数据


对活动的信息进行筛选去重和合并

我的state里的commonGoods居然跟最后的arr结果是一样的。明明我只是获取rootState里的commonGoods然后复制为新的数组进行操作,并没有通过dispatch对commonGoods进行任何操作。

经过一番折腾发现,无论我怎么复制commonGoods,我在此方法中复制的originGoodsList始终是和state里的commonGoods公用一个内存地址,所以我在此借用JSON.parse(JSON.stringify)对其进行深度复制。

然后又因为,我originGoodsList里所有的数据都是从其他goods里的东西合并的,

紧接着我在对originGoodsList里对应其他goods里的部分进行修改时,一样会联动到state里的对应其他goods的部分,

所以我在originGoodsList进行数据收集之后我对其进行了再一次的深度复制获得到了另外一个transferGoodsList。

从而规避了这种奇怪的指针紊乱的问题。

你可能感兴趣的:(关于vuex state可不通过指令而通过底层指针改变的问题)