mpvue leancloud-realtime(sdk 4.3.0) 加入聊天室后 无法正常触发mpvue setData 导致无法正常渲染

[acheng521]

小程序的变量发生变化 会自动触发mpvue的 setData

[acheng521]

同样的问题

事实上 4.0.0 在 vue 中也是可以使用的，只是因为不是 plain object，有可能会出现很多意想不到的问题。然后 mpvue 在 vue 的基础上做了一些「优化」，但是这里假设了 data 都是 plain object，所以当给了 Conversation 实例的时候就抛异常了：

[leeyeh]

嗯，那你要不先试一下这里的解决方案：

受限于 Vue 的工作原理，Vue 的最佳实践是使用 plain object 作为 data，这里不建议在 Vue 中直接将 Conversation 实例作为 data。 建议使用 #toJSON 方法得到 plain object 再给 data： .then(conversations => { this.conversations=conversations.map(c => c.toJSON()) // and store conversations elsewhere for further usage })

我们正在修订文档来提示绕过这个「坑」。

[acheng521]

不仅仅是赋值造成的影响。不将 conversations json序列赋值给变量也会引起图示报错。我截图的代码没有赋值。

[acheng521]

具体debug时，在执行conversation.on 时 百分比出现 “cannot assign to read only property 'symbol(listeners) of object '#websocket'”。 基本在调用realtime 时，只要触发了页面数据变更就会造成这个异常报错。

同理，原生小程序 无此问题。

[leeyeh]

截图里的报错有可能是 console.log(conversation) 造成的。

[acheng521]

去掉结果是一样的。

[acheng521]

我试了很多遍

[leeyeh]

那截图里的那个异常是哪一行抛出的呢？

[acheng521]

没有具体哪一行，只要执行realtime的message监听 （conversation.on） 。进行变量赋值（非conversation，正常的变量赋值，不可能不进行变量赋值的）就会进入mpvue的 updateDataToMP，紧接着就是小程序的 page setdata 。就会出现 前面的报错。

前面包括提到另外那个帖子里的 conversation 赋值 只是提早进入到mpvue 的updateDataToMP 导致报错。

也就是说在执行realtime的操作过程中，只要进行变量赋值就会触发。conversation.on 监听必触发。

[leeyeh]

我大概猜到了，是因为 realtime 也在 this 上。

mpvue 里有没有机制可以在 page 上挂载一些状态，但是不参与渲染的呢？

请把 realtime 挂到 app（原生开发中有个 getApp()，不知道 mpvue 里对应的是啥） 上

[acheng521]

我尝试挂载到 mpvue的 vuex上 也是会触发的

[acheng521]

我上面的代码this.realtime 就是挂载到mpvue的全局变量里 vuex

[leeyeh]

按理说只有组件的 data/props/computed 里的数据会被渲染，我还是怀疑你在这些地方放了一些非 Plain Object 的数据。

我这边也没有完整的代码，你能调试一下看到底这个数据是啥吗？

[acheng521]

我给你一个脱水版的小程序 mpvue吧。

[acheng521]

去掉结果是一样的。。。。

原始邮件 发件人: leeyehsupport@leancloud.rocks 收件人: cheng.wucheng.wu@dji.com 发送时间: 2019年4月18日(周四) 17:14 主题: [LeanCloud 用户社区] [问题讨论/实时通信] mpvue leancloud-realtime(sdk 4.3.0) 加入聊天室后 无法正常触发mpvue setData 导致无法正常渲染

[https://forum.leancloud.cn/user_avatar/forum.leancloud.cn/leeyeh/45/273_1.png] leeyehhttps://forum.leancloud.cn/users/leeyeh 自动回复机器人 April 18

截图里的报错有可能是 console.log(conversation) 造成的。

通过邮件回复或者在浏览器中访问 https://forum.leancloud.cn/t/mpvue-leancloud-realtime-sdk-4-3-0-mpvue-setdata/20109/9 。

[acheng521]

自己已解决

[leeyeh]

很好奇原因是什么？SDK 有什么可以改进的吗？

[acheng521]

原因没找到。。。
不在mpvue的页面组件里使用就没事。
我在mpvue的vuex 调用 避免了这个问题~

[acheng521]

我看文档不同应用对应不同域名。我现在用的测试应用。提前设置测试应用的域名到小程序的白名单 是否可以？正式应用会另外注册。

原始邮件 发件人: leeyehsupport@leancloud.rocks 收件人: cheng.wucheng.wu@dji.com 发送时间: 2019年4月24日(周三) 10:58 主题: [LeanCloud 用户社区] [问题讨论/实时通信] mpvue leancloud-realtime(sdk 4.3.0) 加入聊天室后 无法正常触发mpvue setData 导致无法正常渲染

[https://forum.leancloud.cn/user_avatar/forum.leancloud.cn/leeyeh/45/273_1.png] leeyehhttps://forum.leancloud.cn/users/leeyeh 自动回复机器人 April 24

很好奇原因是什么？SDK 有什么可以改进的吗？

通过邮件回复或者在浏览器中访问 https://forum.leancloud.cn/t/mpvue-leancloud-realtime-sdk-4-3-0-mpvue-setdata/20109/21 。