uni.$on无法更新data中的数据的问题

已于 2022-04-28 21:42:21 修改
阅读量3.1k 收藏 2
点赞数 1
分类专栏： uniapp 文章标签： vue.js 前端 javascript
于 2022-03-16 14:56:42 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/weixin_43647868/article/details/123526386
版权
在Vue的 uni-app 中，通过uni.$on接收从其他页面传递的数据时，若直接在onload中更新data，可能导致数据无法响应式更新。这是因为uni.on中的this并不指向Vue实例。解决方案包括使用vue.set或者临时变量接收uni.on数据，然后修改data属性，以确保Vue能够正确响应数据变化。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

a页面uni. e m i t 传 值 给 b 页 面 ， b 页 面 使 用 u n i . emit传值给b页面，b页面使用uni. emit传值给b页面，b页面使用uni.on接收数据，如果onload中不使用let res这个变量接收uni. o

最低0.47元/天 解锁文章
uniapp 使用 $emit和$on——$on中无法为data中的变量赋值
weixin_48596030的博客
12-05 1636
问题在于this的指向，解决办法是使用变量保存$on，其次再为data中的值赋值。
uniapp详情页以及设置页间的数据更新显示$on$emit方式
u012504951的博客
03-17 1216
用用户详情页面或者群聊详情页的时候，经常有页面信息需要做修改，例如修改用户昵称或者标签。 步骤 1、点击标签进入设置标签页面。 2、设置完标签后，与后台接口交互。 3、返回详情页。 此时一般的在线处理方式，是返回详情页时请求接口重新刷新页面数据。 现在使用on的方式就可以改为这样1、进入详情页后，onload时候监听一个全局函数‘updatetimeTag’。2、进入标签设置后，更新后台接口，同过on的方式就可以改为这样 1、进入详情页后，onload时候监听一个全局函数‘updatetimeTag’。 2
UniApp中$on、$emit，数据更新页面内容不更新
qq_39084174的博客
04-30 1237
UniApp中$on、$emit，数据更新页面内容不更新
uniapp 踩坑记录 uni.$on为什么不能修改data里面的数据
qq_44695769的博客
05-31 1793
这个其实是个逻辑错误，还好我有个时间的参数，我才看出来是什么问题事件监听只能放在主页面，可以返回的页面，子页面由于启动的顺序和重复打开刷新的问题，在子页面新建的监听器永远都用不上。子传父可以用事件监听，父传子不行。
uni.$on给数据赋值视图没更新
m0_46365130的博客
05-04 2598
解决办法：给uni.$emit设置延时 this.setTimeout(()=>{ uni.$emit('sendPageData',data) }, 500);
uniapp uni.$on无法改变data数据解决办法
weixin_43273349的博客
09-23 401
【代码】【无标题】
uniapp开发小程序onShow中使用uni.$on监听未消亡Bug
学点的优快云博客
07-28 897
uniapp开发小程序onShow中使用uni.$on监听未消亡Bug。大家好，我是学点！在一个键盘打碟鼠标卡点即吵闹又寂静无声的办公大厅，我听到来自领导的呼唤，进入领导办公室后领导说调用第三方接口与我们系统业务不匹配，第三方接口调用量严重超标，调用接口费用一直网上增，心里咯噔一下！赶紧回到岗位上查看日志排查问题。目前我正在为公司开发一款微信小程序。我是一名前后端全栈开发小哥，负责的模块前端和后端都是由我来码。
uni.$emit uni.$on
最新发布
12-26
在uniApp框架中，`uni.$emit` 和 `uni.$on` 是Vue.js中的事件系统，它们用于组件间的通信。 1. **uni.$emit**: 发射事件，主要用于子组件向父组件或同级组件传递信息。基本语法如下： ```javascript this.$emit...
uni.$emit 和uni.$on
07-28
uni.$emit和uni.$on是uni-app框架中用于组件间通信的方法。 uni.$emit是在组件中触发自定义事件的方法。可以通过uni.$emit(eventName, data)来触发一个自定义事件，并且可以传递一些数据。其他组件可以通过uni.$on...
uniapp使用页面通讯$on $emit跳转页面 页面拿到值 但页面不刷新
琉璃仙的博客
11-24 3429
问题出现原因 很简单的需求 我要往下一个跳转的页面传参并且这个参数多 所以我不想在地址栏里面传 然后就在官方找到了它，神奇的事情出现了 值传了页面收到了 然后赋上值了 好！不刷新(不显示且页面没有改变) 解决方法: 1.设置延迟(有效简单好用) setTimeout(()=>{ uni.$emit('事件名',{msg:'设置延迟'}) }, 500) 2.设置参数在本地缓存main.js里面但是我tm不可能全放进去啊(有效但不推荐) 3.嵌套使用(有效 感觉这样更好但是我使用
uni-app中uni.$on()无法接收到数据
LRQQHM的博客
05-28 755
【代码】uni-app中uni.$on()无法接收到数据。
uniapp使用页面通讯$on、$emit进行数据传参，页面不刷新问题
shuai1999m的博客
05-15 2685
根据本人研究半天，经过数次测试发现跟路由跳转的方式有关 只有以下两种方式路由跳转，页面通讯数据才生效 uni.navigateBack() uni.switchTab() 亲测！！！！
uniapp在不同页面间跳转时使用$emit和$on传值无效问题（记录坑）
热门推荐
a666666000的博客
09-08 1万+
uniapp在不同页面间跳转时使用$emit和$on传值无效问题
uni-app 中$on 监听不到$emit事件的问题
weixin_43416930的博客
09-27 2937
特别是在遇到以下这种情况的时候页面A 跳转页面B， 页面A中 $emit()事件，页面B＄on监听事件，这时候就会发现明明事件发射了，但是页面B就是监听不到。，但是上面的业务场景明显办不到，所以可以使用 localStorage 或者uniapp中 getApp() 等的方式将要传递的东东暂存，就可以实现以上场景。，打个比喻，类似于汽车撞墙了你知道拐了，股票涨了你知道买了，犯错误判刑了你知道悔改了，鼻涕都流到嘴里了你才知道要甩了。心似双丝网，中有千千结。
[uni-app]$emit和$on，$on中无法为data中的变量赋值
weixin_38949279的博客
06-13 1612
[uni-app]$emit和$on，$on中无法为data中的变量赋值；组件之间、多级组件之间通信的方式；
uniapp小程序data数据不更新解决方法
weixin_44671184的博客
05-09 3621
data() { return { list: [{ name: '小明', age: 18 },{ name: '小美', age: 12 }], text: '我是未修改的字符串值' } } // 第一种：修改数组中的某一个属性 // 修改列表中小美的数据(此对象所有的属性都要重新赋值) this.$set(this.list, 1, { name: '小美', age: 18 }) // 第二种：单独修改列表中小美的年龄为18岁(不影响其它属性) t
uni-app $emit和$on传值第一次获取不到值
weixin_44356010的博客
07-28 2818
在使用$emit传递参数或者对象、数组时第一次获取不到传递过去的数据。解决办法在传递的时候加个延迟，大于或者等于500毫秒就可以。
uni-app使用uni.$emit()和uni.$on()传值后列表页面不渲染
飞蛾逐月
04-23 720
更新数组要用.splice(索引, 数量, 元素)
UNI-APP_解决uni-app页面通讯(uni.$emit()、uni.$on())无效的BUG
小歪博客
01-09 2161
解决uni-app页面通讯(uni.$emit()、uni.$on())无效的BUG
评论 6
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值