微信小程序使用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 相关文章推荐
javascript Firefox与IE 替换节点的方法
Feb 24 Javascript
JavaScript replace(rgExp,fn)正则替换的用法
Mar 04 Javascript
Jquery index()方法 获取相应元素索引值
Oct 12 Javascript
JavaScript中数组添加值和访问值常见问题
Feb 06 Javascript
JS与jQuery实现隔行变色的方法
Sep 09 Javascript
JS实现的按钮点击颜色切换功能示例
Oct 19 Javascript
jQuery 实现左右两侧菜单添加、移除功能
Jan 02 jQuery
在vue项目创建的后初始化首次使用stylus安装方法分享
Jan 25 Javascript
JS代码实现电脑配置检测功能
Mar 21 Javascript
Vue使用axios出现options请求方法
May 30 Javascript
vue中node_modules中第三方模块的修改使用详解
May 31 Javascript
使用Vue-cli3.0创建的项目 如何发布npm包
Oct 10 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
PHP读取ACCESS数据到MYSQL的代码
2011/05/11 PHP
PHP 面向对象详解
2012/09/13 PHP
PHP+jQuery+Ajax实现用户登录与退出
2015/04/27 PHP
合格的PHP程序员必备技能
2015/11/13 PHP
PHP实现获取并生成数据库字典的方法
2016/05/04 PHP
Laravel框架分页实现方法分析
2018/06/12 PHP
js中parseInt函数浅谈
2013/07/31 Javascript
JS判断数组中是否有重复值得三种实用方法
2013/08/16 Javascript
jquery实现一个简单的表单验证实例
2016/03/30 Javascript
微信小程序 swiper组件详解及实例代码
2016/10/25 Javascript
html中鼠标滚轮事件onmousewheel的处理方法
2016/11/11 Javascript
a标签置灰不可点击的实现方法
2017/02/06 Javascript
Angular搜索场景中使用rxjs的操作符处理思路
2018/05/30 Javascript
详解基于Node.js的HTTP/2 Server实践
2018/05/31 Javascript
Vue加载组件、动态加载组件的几种方式
2018/08/31 Javascript
使用validate.js实现表单数据提交前的验证方法
2018/09/04 Javascript
基于Koa2写个脚手架模拟接口服务的方法
2018/11/27 Javascript
vue style width a href动态拼接问题的解决
2020/08/07 Javascript
Python实现比较两个文件夹中代码变化的方法
2015/07/10 Python
Linux下为不同版本python安装第三方库
2016/08/31 Python
django模板语法学习之include示例详解
2017/12/17 Python
对python 操作solr索引数据的实例详解
2018/12/07 Python
python绘制多个子图的实例
2019/07/07 Python
Python实现滑动平均(Moving Average)的例子
2019/08/24 Python
Python使用微信接入图灵机器人过程解析
2019/11/04 Python
python 已知一个字符,在一个list中找出近似值或相似值实现模糊匹配
2020/02/29 Python
Python模拟键盘输入自动登录TGP
2020/11/27 Python
Bose加拿大官方网站:美国知名音响品牌
2019/03/21 全球购物
2014年教师培训的自我评价
2014/01/03 职场文书
文案策划求职信
2014/03/18 职场文书
总结表彰大会主持词
2014/03/26 职场文书
爱护花草树木的标语
2014/06/11 职场文书
班子个人四风问题整改措施
2014/10/04 职场文书
八年级历史教学反思
2016/02/19 职场文书
关于拾金不昧的感谢信(五篇)
2019/10/18 职场文书
MySQL图形化管理工具Navicat安装步骤
2021/12/04 MySQL