1. 程式人生 > >微信小程式(5)--頁面跳轉傳值(點選item傳值)

微信小程式(5)--頁面跳轉傳值(點選item傳值)

one頁面實現以下程式碼:

1,data-id="{{item.id}}"為標記列表的下標,

item.id的來源與wx:for="{{ components }}"的列表渲染

bindtap="readArticle"點選事件

在for迴圈的時候會報異常,加wx:key=""異常就不會出現了

<view class="grids-small">
<block wx:for="{{ components }}" wx:key="">
<view class="grid" bindtap="readArticle"  data-id="{{item.id}}">
<view class="grid_icon">
<image class="grid_icon" src="../resources/room.jpg" alt="" />
</view>
<view class="grid_label">{{ item.title }}</view>
     </view>
</block>
</view>

2。JS:

  readArticle:function(e){
    var $data = e.currentTarget.dataset;
    console.log('$data===啊哈哈' + $data.id);
    wx.navigateTo({
      url: '/pages/index/index?id='+ $data.id ,
    })
  } 

3, two頁面實現以下程式碼:

 /**
   * 生命週期函式--監聽頁面載入
   */
  onLoad: function (options) {
    var $data = options.id;
    console.log('onLoad' + $data)
    console.log('options======' + $data);
    
  },

注意:

我在剛開始執行這段程式碼時 two頁面實現id輸出始終為undefined,輸出options中也沒有id值。最後將var userid= options.id改為var $data = options.id,然後就沒問題了,可以正常得到資料。