【报Bug】nvue界面使用vuex有问题？

分类：uni-app

bug反馈

产品分类： uniapp/App

PC开发环境操作系统： Windows

PC开发环境操作系统版本号： windows10

HBuilderX类型： Alpha

HBuilderX版本号： 3.3.8

手机系统： Android

手机系统版本号： Android 8.1

手机厂商：华为

手机机型：荣耀8Ccc

页面类型： vue

vue版本： vue2

打包方式：云端

项目创建方式： HBuilderX

操作步骤：

配置vuex，写个简单的示例，分别编译为微信小程序和app
查看修改vuex状态后，在util.js中是否能拿到改变后的状态

预期结果：

app和微信小程序都能通过store.state拿到改变后的状态

实际结果：

小程序通过store.state拿到改变后的状态
app拿到的只是初始状态（最初定义的时候的状态）

bug描述：

在配置的某个工具js（util.js）中，使用如下代码引入vuex去，想获取到vuex的数据后使用。
import store from '@/store/index.js';

在一个界面（小程序用的是.vue，app用的是.nvue），调用this.$store.commit('**', str)去改变vuex中的某个数据后

调用util.js中的某个，获取vuex更新后的状态
console.log("设置角标这里的",store.state.message);

问题来了，编译为小程序的时候执行上面的打印，能拿到更新后的数据。
但编译为app（使用的.nvue）的时候，拿到的就是最初的默认值（连登录状态都是空的）

2022-03-18 17:19 负责人:无分享

3 个回复

自学的烦恼 - 自学的烦恼

nvue里使用vuex不能像非nvue方法那样去用
例如：Vue.prototype挂载的，是这样this.$store.state去取；
用import store from '@/store/index.js'，是store.state去取
但是，它们在nvue其实是不同的，用this.$store.commit去赋值，store.state取的值并不是this.$store.commit赋的值，因为store.state的值压根就没去改变。
所以要想在nvue里用vuex,在main.js引入store后，用这种uni.$store = store方法挂载上，所有页面都可以用，不管vue文件、js文件还是nvue文件都可以用uni.$store.state这种方法拿到值，而且js文件也不需要再去单独引入store文件了，赋值的话自然也要uni.$store.commit这样去用

自学的烦恼

因为uni是官方的，所以直接利用官方的uni挂载上去，达到全端实现

2022-03-18 18:21
YyJj123123 (作者)

我丢，大哥的意思就是不挂载在vue的原型，直接挂在uni下面，然后js、vue、nvue都能使用了。。。。

我刚试了确实行，谢谢大佬，真的我整了一下午了都，压根没想过挂载Uni下面。。。

2022-03-18 18:24
YyJj123123 (作者)

太感谢了太感谢了

2022-03-18 18:24
FireFlyTest

回复 1***@qq.com: 也不好用，不能在节点上调用uni下面的方法。比如<view @tap="uni.$app.toast('123')"></view> 这种就不行

2022-03-19 17:11
自学的烦恼

回复 9***@qq.com: 正常，因为官方他自己的都不行

2022-03-20 20:09
5***@qq.com

谢谢，解决了我的问题，uni太无语了

2022-04-23 04:07
1***@qq.com

感谢大佬，完美解决

2022-06-15 10:32
3***@qq.com

感谢感谢，阁下真乃神人也

2022-06-23 18:23
L***@126.com

2023年8月24日这个坑依然存在，按照大佬所说已经解决！

2023-08-24 21:17
Adlaw

大神6666666

2024-06-18 17:47