微信小程序实现两个页面传值的方法分析


Posted in Javascript onDecember 11, 2018

本文实例讲述了微信小程序实现两个页面传值的方法。分享给大家供大家参考,具体如下:

需求:发送页面通过url传值,接收页面获取值。

发送页面的js

var nowid='10';
wx.navigateTo({
  url: '../index/index?id='+nowid,
})

或者发送页面用navigate 组件:

<navigate url="xxx?id=10"></navigate >

如果id是page里面data的数据。是动态的,那么可以写成:

<navigate url="xxx?id={{pid}}"></navigate >

这种方式也是通过接收页面的onload来获取id的

接收页面的js

在接收页面onload的函数里就可以获取到值:

onLoad: function (options) {
  var _obj=options.id;
  console.log(_obj)
}

(1) 接收页面获取到的 options 就是发送页面的 url 中 问号后面传过来的值

(2) 如果传过来的值是一个json对象,那么需要现在发送页面把这个对象JSON.Stringfy转化成字符串,然后 接收页面 再使用JSON.parse转化成json对象就行。

还有种方法是通过小程序的本地存储 wx.setStorage()等API接口来实现-----》发送页面存入,接收页面在接受。当然,不需要的时候可以把存入的数据删掉

还有一种方式就是:在app.js中设置数据,然后其它页面在需要的时候,就可以通过  app.数据等形式来获取。当然,需要在接收数据的页面声明:

var app=getApp();

希望本文所述对大家微信小程序开发有所帮助。

Javascript 相关文章推荐
JavaScript 创建对象和构造类实现代码
Jul 30 Javascript
js仿微博实现统计字符和本地存储功能
Dec 22 Javascript
javascript中call apply 与 bind方法详解
Mar 10 Javascript
js点击按钮实现水波纹效果代码(CSS3和Canves)
Sep 15 Javascript
Angular2.js实现表单验证详解
Jun 23 Javascript
vue动态路由实现多级嵌套面包屑的思路与方法
Aug 16 Javascript
利用VS Code开发你的第一个AngularJS 2应用程序
Dec 15 Javascript
JavaScript中变量提升与函数提升经典实例分析
Jul 26 Javascript
vue移动端实现手机左右滑动入场动画
Jun 17 Javascript
Vue.js组件props数据验证实现详解
Oct 19 Javascript
小程序点击图片实现png转jpg
Oct 22 Javascript
react+antd 递归实现树状目录操作
Nov 02 Javascript
jQuery使用bind动态绑定事件无效的处理方法
Dec 11 #jQuery
微信小程序实现的3d轮播图效果示例【基于swiper组件】
Dec 11 #Javascript
vue-cli 3.0 版本与3.0以下版本在搭建项目时的区别详解
Dec 11 #Javascript
微信小程序非swiper组件实现的自定义伪3D轮播图效果示例
Dec 11 #Javascript
vue-cli2.0转3.0之项目搭建的详细步骤
Dec 11 #Javascript
jQuery实现点击旋转,再点击恢复初始状态动画效果示例
Dec 11 #jQuery
如何让node运行es6模块文件及其原理详解
Dec 11 #Javascript
You might like
用PHP实现将GB编码转换为UTF8
2006/11/25 PHP
探讨PHP删除文件夹的三种方法
2013/06/09 PHP
PHP 微信扫码支付源代码(推荐)
2016/11/03 PHP
js 变量类型转换常用函数与代码[比较全]
2009/12/01 Javascript
js写一个弹出层并锁屏效果实现代码
2012/12/07 Javascript
js实现的标题栏新消息闪烁提示效果
2014/06/06 Javascript
Javascript Object 对象学习笔记
2014/12/17 Javascript
Javascript 正则表达式实现为数字添加千位分隔符
2015/03/10 Javascript
jquery自动补齐功能插件flexselect用法示例
2016/08/06 Javascript
jQuery纵向导航菜单效果实现方法
2016/12/19 Javascript
vue轮播图插件vue-awesome-swiper的使用代码实例
2017/07/10 Javascript
js+html5生成自动排列对话框实例
2017/10/09 Javascript
基于 Vue.js 之 iView UI 框架非工程化实践记录(推荐)
2017/11/21 Javascript
vue.js使用代理和使用Nginx来解决跨域的问题
2018/02/03 Javascript
微信小程序模板消息推送的两种实现方式
2019/08/27 Javascript
layui中的switch开关实现方法
2019/09/03 Javascript
JS如何定义用字符串拼接的变量
2020/07/11 Javascript
[03:38]2014DOTA2西雅图国际邀请赛 VG战队巡礼
2014/07/07 DOTA
用Python脚本来删除指定容量以上的文件的教程
2015/05/04 Python
用python的requests第三方模块抓取王者荣耀所有英雄的皮肤实例
2017/12/14 Python
解决Python3.5+OpenCV3.2读取图像的问题
2018/12/05 Python
Python可视化mhd格式和raw格式的医学图像并保存的方法
2019/01/24 Python
python 实现图片上传接口开发 并生成可以访问的图片url
2019/12/18 Python
如何安装并在pycharm使用selenium的方法
2020/04/30 Python
python mysql中in参数化说明
2020/06/05 Python
python产生模拟数据faker库的使用详解
2020/11/04 Python
HTML5实现移动端复制功能
2018/04/19 HTML / CSS
阿玛尼美妆俄罗斯官网:Giorgio Armani Beauty RU
2020/07/19 全球购物
2014年预备党员学习两会心得体会
2014/03/17 职场文书
保护环境倡议书500字
2014/05/19 职场文书
护士工作失误检讨书
2014/09/14 职场文书
毕业证委托书范文
2014/09/26 职场文书
质检员工作总结2015
2015/04/25 职场文书
投诉信格式范文
2015/07/02 职场文书
高中16字霸气押韵班级口号集锦!
2019/06/27 职场文书
导游词之西安骊山
2019/12/03 职场文书