Quasar 中使用Vuex的方法和步骤

** 首先根据Quasar-cli创建出来的项目会自带Vuex我们只需让让自行安装即可**
如图
如图所示就是Quasar-cli自行创建出来的Vuex
第一步:
在这里插入图片描述
如图所示: 在自行生成中的index.js中进行引入我们自己创建的user文件最后在通过 return的把他们都暴露出去

第二步:
在需要用到Vuex的地方进行以下如图所示的步骤操作
与i
如图所示: 首先我们先通过let创建出一个新的对象在新的对象中创建一个新的数据名最后把新的数据等同于我们创建的数据名就可以了.
回顾上一步我们已经把store中的user通过return暴露出去了 这里我们就可以直接使用,通过dispatch把我们新创建的对象放入进去就可以了.

第三步:
如图所示: 这个时候我们在进去到user文件中的 actions.js中
在这里插入图片描述
注意:这个里面的"signeddex"是自行创建的 和上一步的"signeddex"是一样的

第四步:
如图所示:然后我们在进入到getters.js文件中这里就都是固定的写法
在这里插入图片描述
如图所代表的意思就是一些逻辑

第五步:
如图所示:然后我们在进入到index.js文件中去,这里的也是固定的写法
在这里插入图片描述
如图所示:这里就代表的是把相关的文件引入进来

第六步:
如图所示:这一步我们进入到mutations.js文件中去
在这里插入图片描述
注意: 这里的"SIGN"和我们第三步中的"SIGN"是一样的紧接着我们在通过localStorafe中的setItem的方法把我们最开始获取到的数据就可以直接放入进浏览器的内存当中去了

第七步:
如图所示:最后我们进去到state.js的文件中去
在这里插入图片描述
如图所示:我们我们首先通过let创建一个localUsername的变量并把浏览器内存中的数据通过getItem的方法拿出来然后给他,最后我们在新创建一个username最后把他暴露出去就可以了

第八步:
如图所示:在需要使用的地方就可以直接使用了
在这里插入图片描述
注意:在每一次使用的时候都必须在使用的这一页代码中添加这两个蓝色所示的代码,最后就可以直接使用差值表达式来进去使用就好了

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值