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


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 相关文章推荐
Extjs TimeField 显示正常时间格式的代码
Jun 28 Javascript
调试Node.JS的辅助工具(NodeWatcher)
Jan 04 Javascript
js汉字转拼音实现代码
Feb 06 Javascript
JavaScript实现网页截图功能
Oct 16 Javascript
JavaScript中的对象序列化介绍
Dec 30 Javascript
JQuery选择器绑定事件及修改内容的方法
Jan 23 Javascript
JavaScript使用function定义对象并调用的方法
Mar 23 Javascript
js实现字符串和数组之间相互转换操作
Jan 12 Javascript
Vuex模块化实现待办事项的状态管理
Mar 15 Javascript
Vue指令的钩子函数使用方法
Mar 20 Javascript
详解Vue的常用指令v-if, v-for, v-show,v-else, v-bind, v-on
Oct 12 Javascript
layui动态渲染生成左侧3级菜单的方法(根据后台返回数据)
Sep 23 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
MySql 按时间段查询数据方法(实例说明)
2008/11/02 PHP
PHP file_exists问题杂谈
2012/05/07 PHP
使用composer安装使用thinkphp6.0框架问题【视频教程】
2019/10/01 PHP
js几个验证函数代码
2010/03/25 Javascript
Js event事件在IE、FF兼容性问题
2011/01/01 Javascript
深入理解JavaScript 闭包究竟是什么
2013/04/12 Javascript
jQuery 获取URL的GET参数值的小例子
2013/04/18 Javascript
javascript遇到html5的一些表单属性
2015/07/05 Javascript
JavaScript实现下拉列表框数据增加、删除、上下排序的方法
2015/08/11 Javascript
探究Javascript模板引擎mustache.js使用方法
2016/01/26 Javascript
JavaScript实现跑马灯抽奖活动实例代码解析与优化(二)
2016/02/16 Javascript
Bootstrap项目实战之首页内容介绍(全)
2016/04/25 Javascript
浅谈js中子页面父页面方法 变量相互调用
2016/08/04 Javascript
js实现右键自定义菜单
2016/12/03 Javascript
js实现文字无缝向上滚动
2017/02/16 Javascript
使用vue和datatables进行表格的服务器端分页实例代码
2017/06/07 Javascript
简单谈谈React中的路由系统
2017/07/25 Javascript
nodejs中art-template模板语法的引入及冲突解决方案
2017/11/07 NodeJs
使用angular-cli webpack创建多个包的方法
2018/10/16 Javascript
vue2.x数组劫持原理的实现
2020/04/19 Javascript
Ant Design的Table组件去除
2020/10/24 Javascript
Python之父谈Python的未来形式
2016/07/01 Python
python thrift搭建服务端和客户端测试程序
2018/01/17 Python
python打造爬虫代理池过程解析
2019/08/15 Python
python的命名规则知识点总结
2019/10/04 Python
Python Selenium模块安装使用教程详解
2020/07/09 Python
size?法国官网:英国伦敦的球鞋精品店
2020/03/15 全球购物
什么是Deployment descriptors;都有什么类型的部署描述符
2015/07/28 面试题
教师评优的个人自我评价分享
2013/09/19 职场文书
精通CAD能手自荐书
2014/01/31 职场文书
奉献家乡演讲稿
2014/09/13 职场文书
酒店仓管员岗位职责
2015/04/01 职场文书
2015年党建工作目标责任书
2015/05/08 职场文书
【js设计模式】SOLID五大设计原则
2022/03/24 Javascript
《游戏王:大师决斗》将推出新卡牌包4月4日上线
2022/03/31 其他游戏
【海涛dota解说】一房久违的影魔魂守二连发
2022/04/01 DOTA