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


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 相关文章推荐
js 调整select 位置的函数
Feb 21 Javascript
js数组的基本操作(很全自己整理的)
Oct 16 Javascript
JavaScript中模拟实现jsonp
Jun 19 Javascript
javascript特殊日历控件分享
Mar 07 Javascript
关于backbone url请求中参数带有中文存入数据库是乱码的快速解决办法
Jun 13 Javascript
简单的渐变轮播插件
Jan 12 Javascript
详解微信开发中snsapi_base和snsapi_userinfo及静默授权的实现
Mar 11 Javascript
基于rem的移动端响应式适配方案(详解)
Jul 07 Javascript
在vue里面设置全局变量或数据的方法
Mar 09 Javascript
基于canvas实现手写签名(vue)
May 21 Javascript
VueJS实现用户管理系统
May 29 Javascript
解决vue项目axios每次请求session不一致的问题
Oct 24 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.MVC的模板标签系统(三)
2006/09/05 PHP
PHP机器学习库php-ml的简单测试和使用方法
2017/07/14 PHP
PHP命名空间与自动加载类详解
2018/09/04 PHP
JavaScript中圆括号()和方括号[]的特殊用法疑问解答
2013/08/06 Javascript
js与jquery获取父级元素,子级元素,兄弟元素的实现方法
2014/01/09 Javascript
微信公众号开发 实现点击返回按钮就返回到聊天界面
2016/12/15 Javascript
jquery插件treegrid树状表格的使用方法详解(.Net平台)
2017/01/03 Javascript
vue脚手架vue-cli的学习使用教程
2017/06/06 Javascript
微信小程序 功能函数小结(手机号验证*、密码验证*、获取验证码*)
2017/12/08 Javascript
详解webpack模块化管理和打包工具
2018/04/21 Javascript
element-ui使用导航栏跳转路由的用法详解
2018/08/22 Javascript
微信小程序云开发之使用云存储
2019/05/17 Javascript
javascript Canvas动态粒子连线
2020/01/01 Javascript
不刷新网页就能链接新的js文件方法总结
2020/03/01 Javascript
JavaScript中的Proxy对象
2020/11/27 Javascript
python回调函数的使用方法
2014/01/23 Python
简单了解python模块概念
2018/01/11 Python
pandas带有重复索引操作方法
2018/06/08 Python
详解python 注释、变量、类型
2018/08/10 Python
Pycharm代码无法复制,无法选中删除,无法编辑的解决方法
2018/10/22 Python
Python打开文件,将list、numpy数组内容写入txt文件中的方法
2018/10/26 Python
对Python使用mfcc的两种方式详解
2019/01/09 Python
Python查找数组中数值和下标相等的元素示例【二分查找】
2019/02/13 Python
Python实现数据结构线性链表(单链表)算法示例
2019/05/04 Python
pycharm访问mysql数据库的方法步骤
2019/06/18 Python
python基于K-means聚类算法的图像分割
2019/10/30 Python
python读取excel数据绘制简单曲线图的完整步骤记录
2020/10/30 Python
Sephora丝芙兰马来西亚官方网站:国际化妆品购物
2018/03/15 全球购物
人事助理自荐信
2014/02/02 职场文书
数控技术学生的自我评价
2014/02/15 职场文书
2014年煤矿安全工作总结
2014/12/04 职场文书
教师党员自我评价2015
2015/03/04 职场文书
2016情人节宣传语
2015/07/14 职场文书
Python 制作自动化翻译工具
2021/04/25 Python
浅谈python中的多态
2021/06/15 Python
ubuntu下常用apt命令介绍
2022/06/05 Servers