微信小程序页面之间传参

微信小程序页面之间的传参方法有四种

1.页面url传参
2.data-属性传参
3.缓存传参
4.全局变量传参

1.页面url传参
navigator标签里面设置url后面用？加上key=value键值对模式传参，可以绑定动态数据

<!-- pageA传递参数 -->
<navigator url="../article/article?articleID=3">页面url传参</navigator>

//pageB接受参数
onLoad: function (options) {
    this.setData({
     articleID:options.articleID           //articleID问pageB页面变量
      
    })
  },

2.data-属性传参
通过data-属性设置产生，在通过url传递参数，其本质还是通过url传参

<!-- pageA页面设置 -->
  <view wx:for='{{articles}}' wx:key='index'>
    <text bindtap="goArticle" data-item='{{item}}'>{{item.title}}</text>
  </view>

//pageA传递参数
  goArticle:function(event){
    var item=event.currentTarget.dataset.item;
    wx.navigateTo({
      url: "../article/article?id="+item.id+"&title="+item.title,
    })
  },

//pageB接受参数
onLoad: function (options) {
    this.setData({
     articleID:options.id，    
     atricleTitle:options.title      
    })
  },

备注：url传参和data-属性传参不能同时使用，否则后设置的生效；

3,缓存传参
小程序缓存分为异步和同步，一般使用同步；方法类似于h5的本地存储；

 //缓存传参
onLoad:function(){
   wx.setStorageSync("title", this.data.title)
}
   

  onLoad: function (options) {
    this.setData({
      motto: wx.getStorageSync("title"),
      
    })

4.全局变量

//1.在app.js中设globalData:{key:value,...}
  globalData: {
    userInfo: null
  }

//2.页面定义var app=getApp()
//3.页面调用变量，app.globalData.key
const app = getApp()
  getUserInfo: function() {
    this.setData({
      userInfo: app.globalData.userInfo,
      hasUserInfo: true
    })
  }