uni小程序不触发onload原因及解决方法

作者在开发uni小程序首页时尝试使用插件区分不同权限页面布局,遇到onload生命周期函数中获取胶囊位置API失效。问题在于误解了生命周期问题,最终发现是由于使用了Vue2模板。作者借此提醒,即使遇到过类似问题并解决,时间长了仍需记录。

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

背景:最近写一个uni小程序首页时需要根据不同权限来显示不同的页面布局,所以就想将不同的页面样式封装成插件来分别显示,

问题:在组件里面onload获取小程序胶囊位置api不起作用

原因:开始一直忽略生命周期这个事情,以为是api的问题,结果打印其他数据也是如此,结果才发现如下

解决:我因为是用vue2模版 所以直接这样就ok啦!

总结:其实以前遇到过这种问题,当时也解决了,但是好久没遇到就给忘了。所以就写了这么简单的一篇,好记性真的不如烂笔头!!!

留言:有前端相关的问题欢迎随时私信交流探讨!!!

uni-app中,执行前一个页面组件中的方法可以通过多种方式实现。以下是几种常见的方法: 1. **使用全局事件总线(EventBus)**: 通过创建一个全局的事件总线,可以在同页面之间传递事件和数据。 ```javascript // 在main.js中定义全局事件总线 Vue.prototype.$eventBus = new Vue(); // 在前一个页面中监听事件 this.$eventBus.$on('methodName', () => { this.methodName(); }); // 在当前页面中触发事件 this.$eventBus.$emit('methodName'); ``` 2. **使用`uni.$emit`和`uni.$on`**: uni-app提供了全局的`uni.$emit`和`uni.$on`方法,可以在同页面之间传递事件。 ```javascript // 在前一个页面中监听事件 uni.$on('methodName', () => { this.methodName(); }); // 在当前页面中触发事件 uni.$emit('methodName'); ``` 3. **使用`getCurrentPages`**: 通过`getCurrentPages`方法可以获取当前页面栈的信息,从而调用前一个页面的方法。 ```javascript // 在当前页面中调用前一个页面的方法 const pages = getCurrentPages(); const prevPage = pages[pages.length - 2]; prevPage.methodName(); ``` 4. **使用路由参数**: 通过路由参数传递回调函数或标识符,在前一个页面中处理相应的逻辑。 ```javascript // 在当前页面中跳转到前一个页面并传递回调标识符 uni.navigateTo({ url: `/pages/prevPage/prevPage?callback=true` }); // 在前一个页面中处理回调逻辑 onLoad(options) { if (options.callback) { this.methodName(); } } ``` 这些方法各有优缺点,选择哪种方式取决于具体的应用场景和需求。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值