热门标签 | HotTags
当前位置:  开发笔记 > 后端 > 正文

uniapp页面回跳传参

实现场景A页面跳转到B页面,然后把参数返回给A页面官方APIuni.navigateTo({url:pagestest?,events:{为指定事件添加一个监听器,获取被打开页面传

实现场景


A页面跳转到B页面,然后把参数返回给A页面


官方API

uni.navigateTo({
url: 'pages/test?id=1',
events: {
// 为指定事件添加一个监听器,获取被打开页面传送到当前页面的数据
acceptDataFromOpenedPage: function(data) {
console.log(data)
},
someEvent: function(data) {
console.log(data)
}
...
},
success: function(res) {
// 通过eventChannel向被打开页面传送数据
res.eventChannel.emit('acceptDataFromOpenerPage', { data: 'test' })
}
})
// uni.navigateTo 目标页面 pages/test.vue
onLoad: function(option) {
console.log(option.query)
// #ifdef APP-NVUE
const eventChannel = this.$scope.eventChannel; // 兼容APP-NVUE
// #endif
// #ifndef APP-NVUE
const eventChannel = this.getOpenerEventChannel();
// #endif
eventChannel.emit('acceptDataFromOpenedPage', {data: 'test'});
eventChannel.emit('someEvent', {data: 'test'});
// 监听acceptDataFromOpenerPage事件,获取上一页面通过eventChannel传送到当前页面的数据
eventChannel.on('acceptDataFromOpenerPage', function(data) {
console.log(data)
})
}

实例


A页面

跳转

methods: {
toAdd(){
uni.navigateTo({
url: '/index/index', //B页面路由
events: {
// 为指定事件添加一个监听器,获取被打开页面传送到当前页面的数据
acceptDataFromOpenedPage: function(data) {
console.log(data,'acceptDataFromOpenedPage')
},
someEvent: function(data) {
console.log(data,'someEvent')
}
},
success: function(res) {
// 通过eventChannel向被打开页面传送数据
// res.eventChannel.emit('acceptDataFromOpenerPage', { data: 'test' })
}
})
,

B页面

跳转

methods: {
nav(id){
const eventChannel = this.getOpenerEventChannel();
console.log(eventChannel,'eventChannel ')
eventChannel.emit('acceptDataFromOpenedPage', {data: id});
eventChannel.emit('someEvent', {data: id});
uni.navigateBack({

})
}
}


推荐阅读
  • PHP 5.4.8 编译安装指南
    本文详细介绍了如何在Linux环境下编译安装PHP 5.4.8,并配置为FastCGI模式运行。包括所需依赖包的安装、源代码下载、编译配置及启动服务等步骤。 ... [详细]
  • 优化 Kotlin 中的 Android Retrofit 和 RxJava 使用
    本文介绍如何在 Kotlin 语言中进一步优化 Android Retrofit 和 RxJava 的使用,通过动态代理简化线程管理,并提供更简洁的代码实现。 ... [详细]
  • 深入解析 Zend Guard 4 功能与配置
    本文旨在通过图文并茂的方式详细介绍 Zend Guard 4 的核心功能及其配置方法,特别适合英文阅读能力有限的技术人员。文中不仅提供了详细的步骤说明,还附带了实际操作中的注意事项,帮助读者更好地理解和应用这一工具。 ... [详细]
  • 本文探讨了在Node.js环境中如何有效地捕获标准输出(stdout)的内容,并将其存储到变量中。通过具体的示例和解决方案,帮助开发者解决常见的输出捕获问题。 ... [详细]
  • 本文深入探讨了JLine库中的ConsoleReader.drawBuffer()方法的使用场景和具体实现,通过多个实际代码示例,帮助开发者更好地理解和应用此方法。 ... [详细]
  • 本文探讨了在createJS中调整图片大小时,为何需要采用缩放方法(如setTransform中的scaleX, scaleY)而不是直接指定在画布上的宽度和高度。同时,对比了这种做法与Canvas原生drawImage方法的差异及其可能的技术优势。 ... [详细]
  • 重新审视Kubernetes的必要性
    近期,我注意到不少人误以为我是Kubernetes的推广者。实际上,我只是分享了一些适合用Kubernetes解决的案例。本文旨在探讨Kubernetes的适用场景,并提供一些替代方案。 ... [详细]
  • 微信小程序支付官方参数小程序中代码后端发起支付代码支付回调官方参数文档地址:https:developers.weixin.qq.comminiprogramdeva ... [详细]
  • Activity跳转动画 无缝衔接
    Activity跳转动画 无缝衔接 ... [详细]
  • 基于Python的微信智能自动回复系统构建
    本文详细介绍如何通过Python编程语言,结合itchat库及青云客智能语音API,构建一个能够自动响应用户消息的微信聊天机器人。主要内容包括环境配置、API对接以及代码实现。 ... [详细]
  • 酷家乐 Serverless FaaS 产品实践探索
    本文探讨了酷家乐在 Serverless FaaS 领域的实践与经验,重点介绍了 FaaS 平台的构建、业务收益及未来发展方向。 ... [详细]
  • 深入解析Android Activity生命周期
    本文详细探讨了Android中Activity的生命周期,通过实例代码和详细的步骤说明,帮助开发者更好地理解和掌握Activity各个阶段的行为。 ... [详细]
  • 基于Java的多功能文档阅读器
    介绍一个完全用Java开发的文档阅读器——XDocViewer,该组件易于集成到各种Java应用程序中,包括Web应用。其主要特点包括:免费使用、支持多种文档格式、依赖项精简、集成简便以及强大的API功能。 ... [详细]
  • 本文探讨了Web API 2中特性的路由机制,特别是如何利用它来构建RESTful风格的URI。文章不仅介绍了基本的特性路由使用方法,还详细说明了如何通过特性路由进行API版本控制、HTTP方法的指定、路由前缀的应用以及路由约束的设置。 ... [详细]
  • 深入探讨Web服务器与动态语言的交互机制:CGI、FastCGI与PHP-FPM
    本文详细解析了Web服务器(如Apache、Nginx等)与动态语言(如PHP)之间通过CGI、FastCGI及PHP-FPM进行交互的具体过程,旨在帮助开发者更好地理解这些技术背后的原理。 ... [详细]
author-avatar
mobiledu2502890433
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有