小程序开发过程中经常有这种需求,需要把当前页面数据传递给上一个页面,但是wx.navigateBack()无法传递数据。

一般的办法是把当前页面数据放入本地缓存,上一个页面再从缓存中取出。

除此之外还有一种办法,巧妙利用页面栈。

getCurrentPages() 函数用于获取当前页面栈的实例,以数组形式按栈的顺序给出,第一个元素为首页,最后一个元素为当前页面。

重点就在这里,在当前页面拿到上一个页面的实例对象,然后调用该对象的方法完成数据传递。

页面A

Page({
data: {
name: ''
},
...
,
//更新name
changeData: function(name){
this.setData({
name: name
})
}
})

页面B,假设有一个文本框用于输入姓名,点击返回按钮后更新页面A的name

Page({
//此方法用于文本框输入回调
inputTyping: function (e) {
//获取页面栈
var pages = getCurrentPages();
if(pages.length > 1){
//上一个页面实例对象
var prePage = pages[pages.length - 2];
//关键在这里
prePage.changeData(e.detail.value)
}
}
})

这样就可以实现数据传递给上一个页面,要注意页面A必须使用wx.navigateTo跳转到页面B,不能使用wx.redirectTo,这样会关闭上一个页面,导致页面B无法获取上一页Page实例。

微信小程序视频教程

微信小程序-返回并更新上一页面的数据的更多相关文章

  1. 微信小程序 在canvas画布上划动,页面禁止滑动

    要实现微信小程序 在canvas画布上划动,页面禁止滑动,不仅要设置disable-scroll="true",还要要给canvas绑定一个触摸事件才能生效. <canvas ...

  2. 微信小程序简单封装图片上传组件

    微信小程序简单封装图片上传组件 希望自己 "day day up" -----小陶 我从哪里来 在写小程序的时候需要上传图片,个人觉得官方提供的 Uploader 组件不是太好用, ...

  3. 微信小程序开发:学习笔记[8]——页面跳转及传参

    微信小程序开发:学习笔记[8]——页面跳转及传参 页面跳转 一个小程序拥有多个页面,我们可以通过wx.navigateTo推入一个新的页面.在首页使用2次wx.navigateTo后,页面层级会有三层 ...

  4. 微信小程序实现图片是上传、预览功能

    本文实例讲述了微信小程序实现图片上传.删除和预览功能的方法,分享给大家供大家参考,具体如下: 这里主要介绍一下微信小程序的图片上传图片删除和图片预览 1.可以调用相机也可以从本地相册选择 2.本地实现 ...

  5. 【微信小程序】scroll-view 的上拉加载和下拉刷新

    1.在微信小程序中,想到 下拉刷新 和 上拉加载,如果是整个页面都拖动的话,可以在页面配置中,配置 enablePullDownRefresh 和 onReachBottomDistance 然后在 ...

  6. 微信小程序缓存滑动距离,当页面浏览到一定位置,滑动其他页面后返回该页面记录之前的滑动距离

    15.微信小程序缓存滑动距离 我们在浏览页面的时候,然后左滑或者右滑到新的页面,等返回此页面,我们希望可以记录上次滑动的距离 虽然这个实现起来并不难,但是会遇到一些坑,因为scroll-view的组件 ...

  7. 微信小程序 下拉刷新 上拉加载

    1.下拉刷新  小程序页面集成了下拉功能,并提供了接口,我们只需要一些配置就可以拿到事件的回调. 1. 需要在 .json 文件中配置. 如果配置在app.json文件中,那么整个程序都可以下拉刷新. ...

  8. 直击根源:微信小程序中web-view再次刷新后页面需要退两次

    背景 在上一章(直击根源:vue项目微信小程序页面跳转web-view不刷新)解决了vue在小程序回退不刷新的问题之后,会引出了一个刷新的页面需要点击返回两次才能返回上一个页面 问题描述 在A页面从B ...

  9. 前端笔记之微信小程序(二){{}}插值和MVVM模式&数据双向绑定&指令&API

    一.双花括号{{}}插值和MVVM模式 1.1 体会{{}}插值 index.wxml的标签不是html的那些标签,这里的view就是div. {{}}这样的插值写法,叫做mustache语法.mus ...

随机推荐

  1. webpack-dev-server 使用 react-router 启用 browserhistory 采坑记

    问题的产生 今天下午请假,忙完手头事之后,在家实在无聊,想着从0开始搭建一个 react 的项目.webpack 基本配置之前研究过,没什么大问题.谁想,在 react-router 的配置时出现了个 ...

  2. python时间格式化、运行时长计算

    1.格式化: import time timeStr=time.strftime('%Y-%m-%d %H:%M:%S',time.localtime()) #格式化为:2018-07-17 19:0 ...

  3. python调用大漠插件教程03窗口绑定实例

    怎样利用注册好的大漠对象来绑定窗口? 直接上代码,根据代码分析 from win32com.client import Dispatch import os from win32gui import ...

  4. LM NTML NET-NTLM2理解及hash破解

    LM Windows Vista / Server 2008已经默认关闭,在老版本可以遇到,但根据windwos的向下兼容性,可以通过组策略启用它(https://support.microsoft. ...

  5. 被缠上了,小王问我怎么在 Spring Boot 中使用 JDBC 连接 MySQL

    上次帮小王入了 Spring Boot 的门后,他觉得我这个人和蔼可亲.平易近人,于是隔天小王又微信我说:"二哥,快教教我,怎么在 Spring Boot 项目中使用 JDBC 连接 MyS ...

  6. Spring AMQP:RabbitTemplate SimpleMessageListenerContainer

    一.RabbitTemplate介绍 RabbitTemplate:消息模板,在与Spring AMQP整合时,进行发送消息的关键类. 包括了可靠性投递消息方法.回调监听消息接口ConfirmCall ...

  7. 50个SQL语句(MySQL版) 问题十六

    --------------------------表结构-------------------------- student(StuId,StuName,StuAge,StuSex) 学生表 tea ...

  8. Java实现 LeetCode 532 数组中的K-diff数对(双指针,滑动窗口)

    532. 数组中的K-diff数对 给定一个整数数组和一个整数 k, 你需要在数组里找到不同的 k-diff 数对.这里将 k-diff 数对定义为一个整数对 (i, j), 其中 i 和 j 都是数 ...

  9. Java动态规划实现最短路径问题

    问题描述 给定一个加权连通图(无向的或有向的),要求找出从每个定点到其他所有定点之间的最短路径以及最短路径的长度. 2.1 动态规划法原理简介 动态规划算法通常用于求解具有某种最优性质的问题.在这类问 ...

  10. java实现 洛谷 P1464 Function

    import java.util.HashMap; import java.util.Iterator; import java.util.LinkedList; import java.util.S ...