小程式中動態取得清單物件資訊的程式碼範例

不言
發布: 2018-10-29 16:49:04
轉載
4337 人瀏覽過

這篇文章帶給大家的內容是關於小程式中動態取得清單物件資訊的程式碼範例,有一定的參考價值,有需要的朋友可以參考一下,希望對你有幫助。

先上效果圖展示

小程式中動態取得清單物件資訊的程式碼範例

小程式中動態取得清單物件資訊的程式碼範例

本內容主要介紹如何在列表中去動態獲取物件詳情:
1.先展示列表內容:
列表內容仍然是透過資料綁定和聊天表渲染來實現,wx:for的一系列參數設定.

<block>
  <view>
    <!--界面跳转 -->
    <image></image>
    <text>{{item.pf_name}}</text>
    <!-- <text>{{item.pf_id}}</text> -->
  </view>
</block>
登入後複製

跳轉函數方法goDetail,跳轉過去的物件ID就是item.pf_id,點選物件就是index
當然這個也可以設定為navigator跳轉,差異是navigator是在連結內加上參數組合傳遞給頁面,這樣適用於寫死的內容。
2.鑑於是動態獲取,自然要請求後台數據:

goDetail: function(ev) {
   var that = this;
   var e = ev.currentTarget.dataset.id;
   console.log("++++++",ev,that)
   wx.setStorageSync("people_id", e), wx.navigateTo({
     url: "../detail/detail"
   })
 },
登入後複製

這裡邊將列表對象id存儲為緩存數據,發送給下一個頁面來獲取。一定要透過列印 console.log(" ",ev,that)。來測試資料是否取得到是否儲存到。
在物件詳情頁可以這樣展示:

require("../../utils/util.js"), getApp();
Page({
data: {
  name: "",
  sex: "",
  birthday: "",
  post: "",
  address: "",
  addtime: "",
  phone: "",
  identityCard: "",
  schools: "",
  pspecialty: "",
  diploma: "",
  workingState: "",
  entrytime: "",
  worktime: ""
},
onLoad: function(e) {
  var t = this,
    a = wx.getStorageSync("session_uid"),
    i = wx.getStorageSync("people_id");
  console.log("--------",i,e,a)
  wx.request({
    url: "https://xxxxxxxxxxxxx.com/wx/userinfo/",
    data: {
      pf_id: i,
      Cookie: a
    },
    method: "POST",
    header: {
      "Content-Type": "application/x-www-form-urlencoded"
    },
    success: function(e) {
      console.log("员工数据", e.data.data);
      var a = e.data.data;
      t.setData({
        name: a.pf_name,
        sex: a.pf_sex,
        birthday: a.pf_birthday,
        post: a.m_id_post,
        address: a.pf_address,
        addtime: a.pf_addtime,
        phone: a.pf_phone,
        identityCard: a.pf_identityCard,
        schools: a.pf_schools,
        diploma: a.m_id_diploma,
        pspecialty: a.pf_specialty,
        workingState: a.pf_workingState.state_name,
        entrytime: a.pf_entrytime,
        worktime: a.worktime
      })
    },
    fail: function(e) {}
  })
},
onReady: function() {},
onShareAppMessage: function() {}
});
登入後複製

透過點擊時傳遞的參數ID來發送請求訊息,到伺服器取得到物件的所有資訊後儲存下來拿到前端頁面,展示對應的。根據後台人員設定的欄位來傳遞對應欄位參數。
最終就能拿到物件的動態資訊。

以上是小程式中動態取得清單物件資訊的程式碼範例的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:csdn.net
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!