目的:了解购物车两种状态下的操作逻辑,方便后续的开发理解。
![](https://img.haomeiwen.com/i17730541/77d6d6375cf2c662.png)
总结:
购物车的各种操作都会有两种状态的区分,但是不会在组件中去区分。
而是在封装在vuex中的actions中去区分,在组件上只需调用actions即可。
在actions中通过user信息去区分登录状态
未登录,通过mutations修改vuex中的数据即可,vuex已经实现持久化,会同步保持在本地。
已登录,通过api接口去服务端操作,响应成功后通过mutations修改vuex中的数据即可,它也会同步在本地。
不管何种操作何种状态返回一个promise,然后组件能够判断操作是否完毕是否成功,再而去做其他事情。
注意:
登录后,需要合并本地购物车到服务端。
退出后,清空vuex数据也会同步清空本地数据
网友评论