在之前的文章当中我们都实现了一个功能就是可以从上一个页面传递数据给下一个页面,那么我们能不能从下一个页面传递数据给上一个页面呢,答案是可以的。

所以说本文这次主要介绍的内容就是返回上一个页面时传递参数给上一个页面的两种方式。

方式一

本质是拿到上一个页面对象,直接修改了上一个页面对象 data 中数据, 更改日志页面的逻辑文件然后,获取到所有的页面从中获取到需要返回的页面,得到对象实例之后通过实例对象更改数据:

// logs.js
Page({
onLoad(options) {
console.log(options);
console.log(options.name);
console.log(options.age);
},
myNavigatorBack() {
wx.navigateBack({}) let pages = getCurrentPages();
let backPage = pages[pages.length -2];
backPage.setData({message: "我是BNTang"});
}
})

首页的 WXML:

<!--index.wxml-->
<text>首页</text>
<text>{{message}}</text>
<button bindtap="toLog">跳转到日志页面</button>

方式二

?> 本质就是触发自定义事件,通过事件参数传递数据

跳转到下一个页面的时候,传递一个自定义事件给下一个页面:

// index.js
Page({
data: {
message: "BNTang"
},
toLog() {
wx.navigateTo({
url: '/pages/logs/logs?name=BNTang&age=18', events: {
abc(data) {
console.log("自定义事件中:" + data);
}
}
})
}
})

日志页面的 js 文件内容:

// logs.js
Page({
onLoad(options) {
console.log(options);
console.log(options.name);
console.log(options.age);
},
myNavigatorBack() {
wx.navigateBack({}) let eventChannel = this.getOpenerEventChannel();
eventChannel.emit("abc", {msg: "我是BNTang"});
}
})

微信小程序-页面跳转数据传递的更多相关文章

  1. 微信小程序页面跳转方法总结

    微信小程序页面跳转目前有以下方法(不全面的欢迎补充): 1. 利用小程序提供的 API 跳转: // 保留当前页面,跳转到应用内的某个页面,使用wx.navigateBack可以返回到原页面.// 注 ...

  2. 微信小程序-页面跳转与参数传递

    QQ讨论群:785071190 微信小程序页面跳转方式有很多种,可以像HTML中a标签一样添加标签进行跳转,也可以通过js中方法进行跳转. navigator标签跳转 <view class=& ...

  3. 微信小程序——页面跳转及传参

    小程序页面跳转 微信小程序的页面跳转依然是以传统的请求转发和请求重定向为主,tabbar的存在,有TAB页面的跳转. 为了微信小程序的简介方便,规定页面路径只能是十层,应尽量避免过多的交互方式. 1. ...

  4. [转] 微信小程序 页面跳转 传递参数

    本文转自:http://blog.csdn.net/qq_31383345/article/details/52795212 微信小程序的页面跳转,页面之间传递参数笔记. CSDN微信小程序开发专栏, ...

  5. 微信小程序页面跳转的三种方式总结

    原文链接 https://blog.csdn.net/zgmu/article/details/72123329 首先我们了解到,小程序规定页面路径只能有五层,所以我们尽量避免多层级的页面跳转 页面跳 ...

  6. 微信小程序页面跳转导航wx.navigateTo和wx.redirectTo

    }) wx.redirectTo(OBJECT) 关闭当前页面,跳转到应用内的某个页面. 还是用上面的三张图示作为例子,当使用wx.redirctTo接口跳转页面时,原来的页面将被删除掉,当然,这是小 ...

  7. 微信小程序页面跳转后js定时器没有销毁的问题

    现在有一个小程序,对页面数据的实时性很强,本来想用socket,仔细研究了一下,万剑不离其中,它是websocket.服务端不会用,所以使用了传统的http请求方式.开发微信小程序必须要知道的事 1. ...

  8. 直击--vue项目微信小程序页面跳转web-view不刷新-根源

    背景 最近项目需要适配小程序,项目是使用了vue开发的网站,其中改造方式是,每个页面都使用小程序创建一个页面通过web-view来显示指定页面的. 在没有使用小程序时,路由跳转时,刷新页面等等,这个是 ...

  9. 微信小程序页面跳转 的几种方式

    最近在做微信小程序,碰到页面跳转的问题,总结一下页面之间跳转的方式 一.wx.navigateTo(OBJECT) 这是最普遍的一种跳转方式,其官方解释为:“保留当前页面,跳转到应用内的某个页面” 类 ...

  10. 微信小程序页面跳转方法汇总

    微信小程序前端页面跳转有多种方式,汇总如下: Tips: 小程序前端的页面跳转之后,跳转之前的页面并不会凭空消失,而是存进了一个类似“页面栈”的空间里: 只有当这个所谓的“页面栈”满了之后页面才会退出 ...

随机推荐

  1. 大端、小端,& 与、 | 或、 ~ 反、 << 左移 >> 右移

    小端存储:较低的有效字节存放在较低的存储器地址,较高的字节存放在较高的存储器地址: 大端存储:较低的有效字节存放在较高的存储器地址,较高的字节存放在较低的存储器地址. & 计算操作数的逻辑按位 ...

  2. RocketMQ事务消息在订单创建和库存扣减的使用

    前言 下单的过程包括订单创建,还有库存的扣减,为提高系统的性能,将库存放在redis扣减,则会涉及到Mysql和redis之间的数据同步,其中,这个过程还涉及到,必须是订单创建成功才进行库存的扣减操作 ...

  3. 2016年第七届蓝桥杯【C++省赛B组】

    第一题:煤球数目 有一堆煤球,堆成三角棱锥形.具体: 第一层放1个, 第二层3个(排列成三角形), 第三层6个(排列成三角形), 第四层10个(排列成三角形), .... 如果一共有100层,共有多少 ...

  4. 《深入理解计算机系统》(CSAPP)读书笔记 —— 第五章 优化程序性能

    写程序最主要的目标就是使它在所有可能的情况下都正确工作.一个运行得很快但是给出错误结果的程序没有任何用处.程序员必须写出清晰简洁的代码,这样做不仅是为了自己能够看懂代码,也是为了在检査代码和今后需要修 ...

  5. freeswitch-1.10.7 on centos7编译安装

    概述 最近由于项目需求,老版本的fs已经不适用,特此升级了freeswitch的版本,使用当前最新的1.10.7版本编译安装. 环境 centos:CentOS  release 7.0 (Final ...

  6. feign接口自动生成工具

    最近发现开发spring cloud时,编写feign接口是一件痛苦的事,不仅要编写feign接口,还有fallback.请求参数和返回值等,大量重复工作,很浪费时间. 于是便想到可以编写工具自动生成 ...

  7. 260. 只出现一次的数字 III

    1.题目介绍 2.题解 2.1 快排+遍历 思路 同本系列前几题一样 代码 class Solution { public: std::vector<int> singleNumber(s ...

  8. 【Gui-Guider】安装后运行模拟器报 JAVA 错误

    运行模拟器出错 上述错误是因为需要JAVA环境 JAVA 环境下载网址 https://www.oracle.com/java/technologies/javase-jdk16-downloads. ...

  9. 浏览器兼容 : IE10

    <script> /*@cc_on @*//*@ if (document.documentMode == 10) { // 只在 IE10 文档模式下运行,例如 IE10 浏览器或 IE ...

  10. [转帖]Kubernetes 1.23:IPv4/IPv6 双协议栈网络达到 GA

    https://kubernetes.io/zh-cn/blog/2021/12/08/dual-stack-networking-ga/#:~:text=Kubernetes%201.23%EF%B ...