微信小程序 頁面傳多個參數跳轉頁面

按照下面的例子便可

 

 

這裏傳參數 我寫做 data-item data-id 來綁定 同事加了點擊事件bindtap

在index.js 

 

 

在 data 裏我寫的是假數據

在跳轉頁面的函數裏傳e 後面定義的東西根據e來肯定 能夠在console打印

console.log(e)

 

 這樣咱們就拿到了 傳遞的數據 而後進行定義等

 

 

這裏跳轉詳情頁的函數 wx.navigateTo 這是一種跳轉的方法 tabBar頁面要用wx.switchTab 路徑後面加上 jsonStr 等

在跳轉的詳情頁面的onload方法裏面寫

 

 

 咱們打印上個頁面傳入的數據

 

 

打印出上個頁面傳入的數據 在進行that.setData 就好了

wxml：

<view class='fast-container'>
  <block wx:for="{{fast}}" wx:key="fast">
    <view class='fast-row' bindtap='goIndexDetail' data-item="{{item}}" data-id="{{list}}">
        <view class='row-tou'>
            <image class='img' src='{{item.image}}'></image>
        </view>
        <view class='row-content'>
          <view class='text'>{{item.name}}</view>
          <view class='content'>{{item.summary}}</view>
        </view>
    </view>
  </block>
</view>

index.js

Page({
 
  /**
   * 頁面的初始數據
   */
  data: {
    fast:[ //假數據
      { 'name': 'red', 'image': '/img/123.jpg','summary':'我是紅色'},
      { 'name': 'green', 'image': '/img/123.jpg', 'summary': '我是綠色' },
      { 'name': 'blue', 'image': '/img/123.jpg', 'summary': '我是藍色' },
      { 'name': 'orange', 'image': '/img/123.jpg', 'summary': '我是橘色' }
    ],
    list:[ //假數據
      {'content':'content-red'},
      { 'content': 'content-green' },
      { 'content': 'content-blue' },
      { 'content': 'content-orange' }      
    ]
  },
  // ----跳轉詳情頁
  goIndexDetail : function (e) {
    // console.log('我要傳入的值e+++',e)
    let id = e.currentTarget.dataset.id;
    let item = e.currentTarget.dataset.item;
    console.log('我傳入的data-id+',id,'我傳入的data-item=',item)
    let str = JSON.stringify(id);
    let _str = JSON.stringify(item)
    wx.navigateTo({
      url: '/pages/index/indexDetail/indexDetail?jsonStr=' + str + "&strr=" + _str,
    })
  },
  /**
   * 生命週期函數--監聽頁面加載
   */
  onLoad: function (options) {
    
  },
 
  /**
   * 生命週期函數--監聽頁面初次渲染完成
   */
  onReady: function () {
    
  },
 
  /**
   * 生命週期函數--監聽頁面顯示
   */
  onShow: function () {
    
  },
 
  /**
   * 生命週期函數--監聽頁面隱藏
   */
  onHide: function () {
    
  },
 
  /**
   * 生命週期函數--監聽頁面卸載
   */
  onUnload: function () {
    
  },
 
  /**
   * 頁面相關事件處理函數--監聽用戶下拉動做
   */
  onPullDownRefresh: function () {
    
  },
 
  /**
   * 頁面上拉觸底事件的處理函數
   */
  onReachBottom: function () {
    
  },
 
  /**
   * 用戶點擊右上角分享
   */
  onShareAppMessage: function () {
    
  }
})

indexDetail.js

Page({
 
  /**
   * 頁面的初始數據
   */
  data: {
    detail: [],
    detailList,
  },
 
  /**
   * 生命週期函數--監聽頁面加載
   */
  onLoad: function (options) {
    let that = this
    // console.log(options)
    //  console.log(options.jsonStr)
    //  console.log(options.strr)
    let item = JSON.parse(options.jsonStr)
    let id = JSON.parse(options.strr)
    console.log('上個頁面跳轉的data-item++', item)
    console.log('上個頁面跳轉的data-id++', id)
    that.setData({
      detail: id,
      detailList: item
    })
  },
 
  /**
   * 生命週期函數--監聽頁面初次渲染完成
   */
  onReady: function () {
    
  },
 
  /**
   * 生命週期函數--監聽頁面顯示
   */
  onShow: function () {
    
  },
 
  /**
   * 生命週期函數--監聽頁面隱藏
   */
  onHide: function () {
    
  },
 
  /**
   * 生命週期函數--監聽頁面卸載
   */
  onUnload: function () {
    
  },
 
  /**
   * 頁面相關事件處理函數--監聽用戶下拉動做
   */
  onPullDownRefresh: function () {
    
  },
 
  /**
   * 頁面上拉觸底事件的處理函數
   */
  onReachBottom: function () {
    
  },
 
  /**
   * 用戶點擊右上角分享
   */
  onShareAppMessage: function () {
    
  }
})