小程序 通過id從列表頁跳轉到對應的詳情頁

從列表頁通過id跳轉到對應的商品詳情頁，可以使用 navigator來跳轉鏈接，也可以綁定函數來實現。

直接使用navigator跳轉

<block wx:for="{{productList}}" wx:key="productId">
  <navigator url="/pages/good-detail/good-detail?productId={{item.productId}}">
    <view class="item" hover-class="item-hover">
    {{item.name}}
    </view>
  </navigator>
</block>

使用綁定方法
wxml

<block wx:for="{{productList}}" wx:key="productId">
    <view class="item" hover-class="item-hover" bindtap="toDetail" data-productid="{{item.productid}}">
    {{item.name}}
    </view>
</block>

js

  //跳轉到詳情
  toDetail: function(e){
    console.log(e)
    let productId = e.currentTarget.dataset.productid
    wx.navigateTo({
      url: '../good-detail/good-detail?productId='+productId,
    })
  }

詳情頁中獲取傳遞過來的參數

onLoad: function (options) {
    //頁面初始化 options爲頁面跳轉所帶來的參數
    console.log(options)
    var id = options.productId
  },

注意點：
1、在wxml中的block標籤並不是一個組件，它僅僅是一個包裝元素，不會在頁面中做任何渲染，只接受控制屬性。
2、通過wxml設置data-[參數名]傳遞參數，[參數名]只能是小寫，不能有大寫。如果在wxml中是大寫，無法獲取，打印查看轉爲小寫的了。