清子道
清子道
  • 发布:2020-06-08 18:14
  • 更新:2020-06-08 18:32
  • 阅读:1199

Vuex mutations内使用Vue.set方法微信小程序报错

分类:uni-app

利用websoket做了一个im,其他功能都已实现,目前使用Vuex来实时更新用户的聊天记录。

在Vuex的mutations内,定义了一个add方法,用于更新最新的聊天记录,聊天记录是一个多层级的json

如果直接采用 = 赋值的方式,Vuex绑定的页面数据并不会响应渲染,需要等到第二次打开页面才会出现,这显然不符合im的基本特性。

所以采用了Vue.set 这个全局的api,文档上说是app、h5、小程序都支持的。

但目前用了以后,发现app没问题,十分符合预期,但是微信小程序就嗝屁了,直接报错。

代码如下:

// 更新数据  
Vue.set(state.msgOneList, [obj.dataKey], obj);

报错如下:

thirdScriptError
Vue is not defined;at onSocketMessage callback function
ReferenceError: Vue is not defined

Vue在微信小程序当中未定义这肯定的,所以我的思路是使用条件编译,微信小程序就用setData方法,但是发现uniapp的框架,并没有提供,我就懵逼了,只好发个帖子,先谢谢。

2020-06-08 18:14 负责人:无 分享
已邀请:
清子道

清子道 (作者)

本帖完结,已找到解决办法,使用对象运算符重新赋值,即可使Vue检测到数据的更新:state.msgOneList = { ...state.msgOneList, [obj.dataKey]: obj }

附上文档地址,万一能帮到遇到同样问题的呢

链接:https://vuex.vuejs.org/zh/guide/mutations.html

该问题目前已经被锁定, 无法添加新回复