如何将两个微信小程序合并_微信小程序--如何在两个页面之间传值

先看一下本周的部分的设计图

在这里插入图片描述

页面设计并不太复杂，主要是产品类型那块点击的样式，其余的都不太复杂，没啥好说的。

这次主要是想记录一下不同页面下的传值

你看，在这个出发城市和目的地城市这两个搜索框点击了之后都跳转了页面，这也就意味着我们在这个工程项目里要新建两个文件夹。拿出发城市为例，原页面名字叫productList.wxml，点击了出发城市的搜索框之后跳转到出发城市的页面，名字叫departureCity.wxml。这是两个不同的文件夹的页面，这也意味着有两个js文件，那他们之间怎么传数据呢？我们需要把用户输入的城市名字传到前一个页面呀。

第一种方法：缓存

拿到用户的输入值，然后用wx.setStorageSync把值缓存下来

回到上一个页面，用wx.getStorageSync这个方法来拿到你需要的数据。

缓存真的是万金油，但是不推荐，显得笨重。肯定有更好的方法

第二种方法：getCurrentPages ()方法

在这里插入图片描述

我们可以用getCurrentPages ()方法来获取当前页面的所有信息，如data数据

跳转后使用 let pages = getCurrentPages()获取当前页面栈的信息

得到并保存用户的输入值

let prevPage = pages[pages.length - 2]这是上一个页面的信息

prevPage.setData({[上一页data中的key]:[输入的值]});

这样我们就把数据保存到了上一页的data中

实例操作

departureCity.js中我们这样写:

returnAddress这个方法绑定了confirm事件，用户点击手机键盘的确定按钮就会跳转回去

returnAddress:function(e){

//本页即departureCity

let pages = getCurrentPages()

//上一页即productList

let prevPage = pages[pages.length - 2]

//得到用户的输入值

let inputValueA= e.detail.value

prevPage.setData({

//inputValue是productList.js里面data里面的定义的，我们把inputValueA的值赋给它

inputValue:inputValueA

})

// 返回上一级页面。即跳转到productList的页面

wx.navigateBack({

delta: 1

})

这样我们的productList页面就拿到了用户的输入值，这个值就储存在productList.js的data里，this.data.inputValue这个就是用户的输入值

如何将两个微信小程序合并_微信小程序--如何在两个页面之间传值相关推荐

如何将两个微信小程序合并_这个小程序厉害了，可以将多个微信群合并成超级大群！...
由于工作需要或者推广宣传需要,我们经常需要建立超过500人的微信群聊,怎么实现呢? 作为一名专业的社群运营人员,这种问题怎么能难得倒我呢? 之前我们玩转社群666就曾经策划了一次<社群资源对接群 ...
微信链接修改图片_微信链接修改图标
自定义链接是什么?微信链接修改图片_微信链接修改图标自定义微信分享链接是指将一条网页链接通过微信接口生成一张卡片,并且该卡片的标题,内容和图片都可以自己编辑.如下图效果 ● 未自定义的网页链接 ● ...
api 定位微信小程序精度_微信小程序开发知识点集锦
一小程序的生命周期代码生命周期就是一个对象的生老病死,通常指程序从创建.开始.暂停.唤起.停止.卸载的过程.小程序的生命周期又可分为应用生命周期和页面的生命周期,先单独分析,在结合两者分析应用生 ...
js微信监听返回_微信小程序（2）- 框架结构amp;运行环境
一.小程序框架结构小程序框架分场景获取.逻辑层和视图层场景获取:场景值是用来描述用户进入小程序的路径,可以在小程序的生命周期onLaunch 或 onShow 里获取.也可以通过wx.getLau ...
audio 小程序放大_微信小程序搜索优化指南
微信在2019年重点对搜索进行了升级,开放了小程序基于页面的搜索,搜索将不再局限于搜索具体的某一个小程序名称,"小程序名称"的优势已经下落神坛.目前搜索是当下小程序唯一的自然流量来 ...
微信小程序商机_微信小程序可能有哪些创业机会？
从本质上来说,不管是微信小程序还是公众号都是一个工具而已,更多的商业模式还是来自于其他一些传统商业或新出现的方式的互联网化改造,通过嫁接到小程序实现互联网化,社交化等概念.目前看到火过的有电商.小游戏 ...
axure小程序模板_微信小程序模板案例收集
微信小程序发布近四年来,诞生了各行各业的高质量小程序,其中有很多都是用微信小程序模板制作的.新手在制作自己的小程序时,就可以参考这些好看的小程序模板案例. 1.电商小程序这是目前非常常见的小程序类型 ...
webstorm下载微信小程序插件_微信电脑版可以打开小程序喽前提你得下载测试版...
据微信开发者团队消息最新推出的小程序开发套件已经支持开发者面向电脑版微信测试微信小程序相关功能. 开发者下载新版本开发套件即可针对电脑版微信进行小程序调试,不过似乎也没有什么需要特别调试的地方. 既然 ...
微信公众号发送小程序卡片_微信公众号群发文章支持添加小程序卡片
2017年4月20日微信发布公告称,微信公众平号群发文章支持添加小程序功能,这对于推广小程序来说,无疑是不错的途径.那么微信公众号群发文章怎么添加小程序?下面爱站技术频道的小编带来的详细教程. 微信公 ...

如何将两个微信小程序合并_微信小程序--如何在两个页面之间传值

如何将两个微信小程序合并_微信小程序--如何在两个页面之间传值相关推荐

最新文章

热门文章