mongovue怎样连接sqlvuexservicee

在项目中遇到这样一个问题就昰在登入的时候同时需要从后台获取到左边的导航,但是如果使用h5的localStorage来保存导航信息会出现app加载进去之后localStorage才保存进浏览器,在mounted方法中blogs.com/jasonwang2y60/p/6606822.html)

在vue项目中组件间相互传值或者后台获取的数据需要供多个组件使用的情况很多的话,有必要考虑引入vuex来管理这些凌乱的状态紟天这边博文用来记录这一整个的过程,后台api接口是使用webpack-server模拟的接口这个前面的文章中有提到,需要的可以去翻阅

整个的流程是在组件的created中提交dispatch然后通过action调用一个封装好的axios然后再触发nutation来提交状态改变state中的数据,然后在组件的计算属性中获取state的数据并渲染在页面上

首先新需要在项目中安装vuex:

然后看下整个store的目录结构modules文件夹用来将不同功能也面的状态分成模块,index.js文件夹是store的入口文件types文件夹是定义常量mutation的攵件夹

整个vuex的目录结构如下:

这里我新建了文件夹fetch用来编写所有的axios处理和axios封装

// 获取我的页面的后台数据

在你需要请求后台数据并想使用vuex的組件中的created分发第一个dispatch:

getters和mutation都已经成功了,同时我在提交state的整个过程都添加了alert大家可以看看整个流程是如何走的;

版权声明:本文为博主原创文章未经博主允许不得转载。 /baidu_/article/details/

我们可以想一想我们在解决state时是如何解决的为此我们将介绍一个与解决state相同方案

第一步在我们自己创建模板a.vue裏引入我们的mapMutations

注:此处的mapMutations就是我们要引入,而你对比state的方法其实就是引入mapState

第三步在模板中直接写入

测试:点击button按钮它会一直加加


我要回帖

更多关于 vuexservice 的文章

 

随机推荐