微信小程序中的onLoad详解及简单实例


Posted in Javascript onApril 05, 2017

微信小程序中的onLoad

onLoad是一个生命周期函数,表示页面加载

onLoad默认有一个Object类型的参数,是指其他页面打开当前页面所调用的 query 参数

举个栗子~

当我们在页面first的js脚本中有一个点击方法onTap

当点击时页面跳转到second页面,用?id = secondId的形式为second页面传递一个值(这里的secondId是一个已经获取过的值)

onTap: function(){ 
 wx.navigateTo({ 
  url: "second?id=" + secondId 
 })

接着我们在second的js文件中接收这个id

这里的参数option就是我们之前收到的Object参数,这样我们就可以在second.js中使用这个id值了

Page({ 
 onLoad: function(options){ 
  var secondId = options.id; 
   console.log(postId); 
 } 
})

注:

我在刚开始运行这段代码时postId输出始终为undefined,输出option中也没有id值。最后将first中的url从单引号改为双引号才得以解决,以为真的是这个原因,可又改回单引号发现一样可以正常运行。不知道是哪里的bug,但像这样改了一下无关紧要的东西才能正常运行的情况我已经遇见好几次了。

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
jquery 学习之二 属性 文本与值(text,val)
Nov 25 Javascript
Bootstrap中文本框的宽度变窄并且加入一副验证码图片的实现方法
Jun 23 Javascript
利用js+css+html实现固定table的列头不动
Dec 08 Javascript
jQuery实现对象转为url参数的方法
Jan 11 Javascript
vue实现某元素吸顶或固定位置显示(监听滚动事件)
Dec 13 Javascript
vuex 的简单使用
Mar 22 Javascript
轻量级JS Cookie插件js-cookie的使用方法
Mar 22 Javascript
vue.js使用v-model指令实现的数据双向绑定功能示例
May 22 Javascript
Vuejs学习笔记之使用指令v-model完成表单的数据双向绑定
Apr 29 Javascript
基于Node.js搭建hexo博客过程详解
Jun 25 Javascript
Vue如何使用混合Mixins和插件开发详解
Feb 05 Javascript
JS typeof fn === 'function' && fn()详解
Aug 22 Javascript
微信小程序 页面跳转如何实现传值
Apr 05 #Javascript
微信小程序 数据遍历的实现
Apr 05 #Javascript
微信小程序 图片绝对定位(背景图片)
Apr 05 #Javascript
JS实现复选框的全选和批量删除功能
Apr 05 #Javascript
Ajax验证用户名或昵称是否已被注册
Apr 05 #Javascript
JS二叉树的简单实现方法示例
Apr 05 #Javascript
Angular.JS利用ng-disabled属性和ng-model实现禁用button效果
Apr 05 #Javascript
You might like
CI框架源码解读之利用Hook.php文件完成功能扩展的方法
2016/05/18 PHP
Ajax中的JSON格式与php传输过程全面解析
2017/11/14 PHP
javascript 中__proto__和prototype详解
2014/11/25 Javascript
node.js中的fs.linkSync方法使用说明
2014/12/15 Javascript
js行号显示的文本框实现效果(兼容多种浏览器 )
2015/10/23 Javascript
javascript拖拽效果延伸学习
2016/04/04 Javascript
浅谈js的html元素的父节点,子节点
2016/08/06 Javascript
js严格模式总结(分享)
2016/08/22 Javascript
jQuery组件easyui基本布局实现代码
2016/08/25 Javascript
HTML5 JS压缩图片并获取图片BASE64编码上传
2020/11/16 Javascript
p5.js入门教程之键盘交互
2018/03/19 Javascript
Vue.directive使用注意(小结)
2018/08/31 Javascript
vue-cli的工程模板与构建工具详解
2018/09/27 Javascript
vue实现移动端轻量日期组件不依赖第三方库的方法
2019/04/28 Javascript
vue路由跳转传参数的方法
2019/05/06 Javascript
JavaScript接口实现方法实例分析
2020/05/16 Javascript
vue切换菜单取消未完成接口请求的案例
2020/11/13 Javascript
Vue如何实现验证码输入交互
2020/12/07 Vue.js
Python脚本完成post接口测试的实例
2018/12/17 Python
Python单元测试unittest的具体使用示例
2018/12/17 Python
Python matplotlib画曲线例题解析
2020/02/07 Python
python使用docx模块读写docx文件的方法与docx模块常用方法详解
2020/02/17 Python
如何在windows下安装Pycham2020软件(方法步骤详解)
2020/05/03 Python
PIP和conda 更换国内安装源的方法步骤
2020/09/21 Python
HTML5 文件上传下载的实例代码
2017/07/03 HTML / CSS
轻松制作精彩视频:Animoto
2018/09/19 全球购物
NFL欧洲商店(德国):NFL Europe Shop DE
2018/11/03 全球购物
linux面试题参考答案(8)
2015/08/11 面试题
大一学生假期实习的自我评价
2013/10/12 职场文书
测绘工程专业求职信
2014/07/15 职场文书
校庆团日活动总结
2014/08/28 职场文书
学校运动会加油词
2015/07/18 职场文书
2015年女工委工作总结
2015/07/27 职场文书
房产销售员2015年终工作总结
2015/10/22 职场文书
Vue.js中v-bind指令的用法介绍
2022/03/13 Vue.js
Go语言编译原理之源码调试
2022/08/05 Golang