微信小程序怎么实现页面的传参

作者：龙 时间：2018-07-31 浏览：

在vue中，我们也会遇到这样的问题，页面之间的跳转需要传递参数，借鉴一下vue的传参方式，下面来看小程序是如何实现页面间的传参

1.监听全局变量

在页面跳转的时候设置全局变量，在页面跳转之后，去获取此全局变量

<!--获取应用的实例-->
const app = getApp()


<!--父页面-->
<!--那么可以在页面跳转的时候设计一个全局变量-->
pagesDerict:function(e){
    console.log(e)
    app.id = e.currentTarget.dataset.songid  <!--3304-->
    wx.navigateTo({
      url: '../player/player'
    })
  } 

<!--子页面-->

 onLoad: function (options) {
    console.log(options.id)<!--3304-->
  }

<!--如此就是实现了页面的参数传递-->

2.通过跳转的url实现

代码实现如下：

<!--父页面-->
 playsong:function(e){
    <!--将元素的表示通过data-*的方式绑定成属性，然后通过dataset的方式获得，拼接在url上-->
    wx.navigateTo({
      url: '../player/player'+"?id="+e.currentTarget.dataset.songid<!--3304-->
    })
  } 
  
  <!--子页面-->
   onLoad: function (options) {
    console.log(options.id)<!--3304-->
    
    
   )
  }