微信小程序使用navigateTo数据传递的实例


Posted in Javascript onSeptember 26, 2017

微信小程序使用navigateTo数据传递的实例

1,传递基本数据类型

index.js 发送页JS

Page({ 
 data: { 
  testStr: '字符串str' 
 }, 
 onLoad: function () { 
 }, 
 next: function(e){ 
  wx.navigateTo({ 
   url: '/pages/test/test?str='+this.data.testStr, 
  }) 
 } 
})

test.js 接受页JS

Page({ 
 data:{ 
 }, 
 onLoad:function(options){ 
  console.log("接收到的参数是str="+options.str); 
 } 
})

打印的Log如下:

接收到的参数是str=字符串str

2,传递对象{}

index.js 发送页JS

Page({ 
 data: { 
  dataObj:{name:'我是name', extra:'我是extra'} 
 }, 
 onLoad: function () { 
 }, 
 toTest: function(e){ 
  wx.navigateTo({ 
   url: '/pages/test/test?dataObj='+JSON.stringify(this.data.dataObj) 
  }) 
 } 
})

test.js 接受页JS

Page({ 
 data:{ 
  dataObj:null 
 }, 
 onLoad:function(options){   
  this.dat.dataObj= JSON.parse(options.dataObj);//解析得到对象 
 }})

打印的Log如下:

test.js [sm]:16 接收到的参数是obj={“name”:”我是name”,”dataObj”:”我是dataObj”}

3,传递数组集合[]

index.js 发送页JS

Page({ 
 data: { 
  list:['item-A','item-B'] 
 }, 
 onLoad: function () { 
 }, 
 next: function(e){ 
  wx.navigateTo({ 
   url: '/pages/test/test?list='+JSON.stringify(this.data.list), 
  }) 
 } 
})

test.js 接受页JS

Page({ 
 data:{ 
  list:[] 
 },  
onLoad:function(options){   
  console.log("接收到的参数是list="+options.list);//此处打印出来的是字符串,解析如下    
  this.data.list = JSON.parse(options.list);//解析得到集合
 }})

打印的Log如下:

test.js [sm]:17 接收到的参数是list=[“item-A”,”item-B”]

如有疑问请留言或者到本站社区交流讨论,感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
jQuery中与toggleClass等价的程序段 以及未来学习的方向
Mar 18 Javascript
DOM 中的事件处理介绍
Jan 18 Javascript
js replace正则表达式应用案例讲解
Jan 17 Javascript
深入了解Node.js中的一些特性
Sep 25 Javascript
jquery实现焦点图片随机切换效果的方法
Mar 12 Javascript
jquery获取css的color值返回RGB的方法
Dec 18 Javascript
jquery中validate与form插件提交的方式小结
Mar 26 Javascript
JavaScript第一篇之实现按钮全选、功能
Aug 21 Javascript
js实现百度登录框鼠标拖拽效果
Mar 07 Javascript
vue 虚拟dom的patch源码分析
Mar 01 Javascript
解决VUE mounted 钩子函数执行时 img 未加载导致页面布局的问题
Jul 27 Javascript
vue组件入门知识全梳理
Sep 21 Javascript
利用Three.js如何实现阴影效果实例代码
Sep 26 #Javascript
使用JavaScript实现在页面中显示距离2017年中秋节的天数
Sep 26 #Javascript
Three.js实现绘制字体模型示例代码
Sep 26 #Javascript
Three.js利用Detector.js插件如何实现兼容性检测详解
Sep 26 #Javascript
JS+jQuery实现注册信息的验证功能
Sep 26 #jQuery
详解vue-cli中的ESlint配置文件eslintrc.js
Sep 25 #Javascript
JavaScript 自定义事件之我见
Sep 25 #Javascript
You might like
咖啡豆要不要放冰箱的原因
2021/03/04 冲泡冲煮
PHP SQLite类
2009/05/07 PHP
PHP中文件读、写、删的操作(PHP中对文件和目录操作)
2012/03/06 PHP
PHP5全版本绕过open_basedir读文件脚本漏洞详细介绍
2015/01/20 PHP
使用WordPress发送电子邮件的相关PHP函数用法解析
2015/12/15 PHP
PHP中addslashes与mysql_escape_string的区别分析
2016/04/25 PHP
php工具型代码之印章抠图
2018/07/18 PHP
laravel5环境隐藏index.php后缀(apache)的方法
2019/10/12 PHP
jQuery之ajax删除详解
2014/02/27 Javascript
js父页面与子页面不同时显示的方法
2014/10/16 Javascript
js用拖动滑块来控制图片大小的方法
2015/02/27 Javascript
ionic 上拉菜单(ActionSheet)实例代码
2016/06/06 Javascript
vue.js 获取当前自定义属性值
2017/06/01 Javascript
JavaScript输入分钟、秒倒计时技巧总结(附代码)
2017/08/17 Javascript
微信小程序开发之自定义tabBar的实现
2018/09/06 Javascript
微信小程序结合Storage实现搜索历史效果
2019/05/18 Javascript
vue指令做滚动加载和监听等
2019/05/26 Javascript
聊聊Vue 中 title 的动态修改问题
2019/06/11 Javascript
vue实现select下拉显示隐藏功能
2019/09/30 Javascript
[02:15]2014DOTA2国际邀请赛 专访LGD.lin小兔子是大腿
2014/07/14 DOTA
Python 随机生成中文验证码的实例代码
2013/03/20 Python
用Python编写一个国际象棋AI程序
2014/11/28 Python
Python RuntimeError: thread.__init__() not called解决方法
2015/04/28 Python
Python按行读取文件的简单实现方法
2016/06/22 Python
python爬取网页内容转换为PDF文件
2020/07/28 Python
python连接mongodb集群方法详解
2020/02/13 Python
STAUD官方网站:洛杉矶独有的闲适风格
2019/04/11 全球购物
衰败城市英国官网:Urban Decay英国
2020/04/29 全球购物
农村党支部先进事迹
2014/01/14 职场文书
市级青年文明号申报材料
2014/05/26 职场文书
律师授权委托书范本
2014/10/07 职场文书
2014年助理政工师工作总结
2014/12/19 职场文书
交警失职检讨书
2015/01/26 职场文书
MySQL外键约束(FOREIGN KEY)案例讲解
2021/08/23 MySQL
高并发下Redis如何保持数据一致性(避免读后写)
2022/03/18 Redis
Redis主从复制操作和配置详情
2022/09/23 Redis