用户
 找回密码
 立即注册

QQ登录

只需一步,快速开始

微客吧 首页 教程 微信小程序 新手教程 查看内容

微信小程序传值基础知识与onload获取说明

纸飞机 2018-3-8 09:35

一:传值基础知识分享者:东阳,原文地址 (1)页面跳转如何传值(实现跳转到不同页面)点击页面WXML:加入自定义属性(data-category="{{categoryTitle}}") js:在event中取出category值并加到URL中 onMoreTap:fun ...

一:传值基础知识

分享者:东阳,

原文地址


(1)页面跳转如何传值(实现跳转到不同页面)

点击页面

WXML:加入自定义属性(data-category="{{categoryTitle}}")

  1. class="more" catchtap="onMoreTap" data-category="{{categoryTitle}}">

js:在event中取出category值并加到URL中

  1. onMoreTap:function(event){
  2. var category=event.currentTarget.dateset.category;
  3. wx.navigateTo({
  4. url:"more-movie/more-movie?category="+category
  5. })
  6. }

(2)js中两个函数如何传值

  1. Page({
  2. data:{
  3. navigateTitle:" ",
  4. },
  5. onLoad:function(options){
  6. var category = options.category;
  7. this.data.navigateTitle = category
  8. },
  9. onReady : function(event){
  10. wx.setNavigationBarTitle({
  11. title: this.data.navigateTitle
  12. })
  13. }
  14. })

二:onload获取说明
分享者:HaiJing1995
onLoad是一个生命周期函数,表示页面加载
onLoad默认有一个Object类型的参数,是指其他页面打开当前页面所调用的 query 参数

举个栗子~
当我们在页面first的js脚本中有一个点击方法onTap
当点击时页面跳转到second页面,用?id = secondId的形式为second页面传递一个值(这里的secondId是一个已经获取过的值)

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

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

  1. Page({
  2. onLoad: function(options){
  3. var secondId = options.id;
  4. console.log(postId);
  5. }
  6. })

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

鲜花
鲜花
握手
握手
雷人
雷人
路过
路过
鸡蛋
鸡蛋
分享至 : QQ空间
收藏