首页 > 课堂 > 小程序 > 正文

微信小程序开发之界面跳转传值实现方法

2020-03-21 16:28:37
字体:
来源:转载
供稿:网友
通过url传值
首先调用一个点击到详情的方法,主要是通过微信API的wx.navigateTo
toDetail: function(e){    var index = e.currentTarget.dataset.index;        //获取下标    var    //获取标题    wx.navigateTo({                                   //保留本页面,跳转到另一个页面      url: '/pages/detail/detail?title='+title,       //传    url+值    })  }

然后详情页面接收值

 onLoad: function (options) {    var    console.log('详情'+title);  }
通过设置全局变量传值
在app.js里面设置一个全局变量host
App({  onLaunch: function () {  },  globalData: {    userInfo: null,    host:'https://www.xzylogic.xyz/wx_Json_Img/bdy.json',  }})

然后在跳转详情的方法里面重新赋值

 toDetail: function(e){    var index = e.currentTarget.dataset.index;        //获取下标    var    //获取标题    const app=getApp();                               //获取app    app.globalData.host=title;                        /给全局变量重新复制,然后在详情取出值    console.log(title);  }
通过本地缓存传值,据腾讯官方说,本地缓存可以设置10MB
首先传值,通过调用腾讯的APIwx.setStorage
// toDetail:在wxml页面指定绑定的方法  toDetail: function(e){    var index = e.currentTarget.dataset.index;        //获取下标    var    //获取标题    wx.setStorage({                                   //设置本地缓存      key: "title",      data: title    })     wx.navigateTo({                                   //保留本页面,跳转到另一个页面     url: '/pages/detail/detail',                       //页面路径   传    url+值     })  },

然后详情获取缓存

onLoad: function (options) {    wx.getStorage({      key: 'title',      success: function(res) {        var        console.log('获取的值: '+title);      },    })  }

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表