微信小程序 wx:for的使用實例詳解
更新時間：2017年04月27日 10:46:57 作者：萌神哆啦A夢
這篇文章主要介紹了微信小程序 wx:for的使用實例詳解的相關資料,需要的朋友可以參考下
微信小程序 wx:for的使用實例詳解
在小程序的開發(fā)過程中，經常會用到在前端頁面循環(huán)打印一個數組或者對象的數據，這樣的話就需要用wx：for來實現。
一般情況下，小程序的utils這個文件夾下，我們可以把本地的數據寫進去，封裝成.js文件，提供對外暴露的接口，然后讀取本地數據，這些在上一篇博客中有詳細介紹。我們最后說到寫好的本地數據可以另一個頁面讀?。?/p>
var fileData = require('../../utils/data.js')
Page({
data: {
showData: fileData.mtData().list,
},
})
在data{}中賦值后，showData就可以直接在wxml中顯示了。接下來說下如何在wxml頁面用wx:for循環(huán)顯示數組，下面是示例：
<view class="item" wx:for="{{showData}}">
<view class="td">
{item.MTId}} {{item.status}}
</view>
</view>
wx：for = “”，“”中寫當前小程序js頁面中data的對象名。
實際效果圖（并非上述代碼實現）
感謝閱讀,希望能幫助到大家,謝謝大家對本站的支持！
相關文章
這篇文章主要為大家介紹了JS前端監(jiān)控采集用戶行為的N種姿勢，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-07-07
這篇文章主要介紹了微信小程序 跳轉傳參數與傳對象詳解及實例代碼的相關資料,需要的朋友可以參考下2017-03-03
這篇文章主要為大家介紹了js字符串含中文下對齊問題解析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-07-07
這篇文章主要介紹了微信小程序搜索組件wxSearch實例詳解的相關資料,需要的朋友可以參考下2017-06-06
這篇文章主要為大家介紹了fetch-event-source庫源碼學習,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-09-09
這篇文章主要為大家介紹了JS前端html2canvas手寫示例問題剖析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-08-08
這篇文章主要為大家介紹了ECMAScript 6對象的擴展實現示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-08-08
TypeScript?學習筆記之?typeScript類定義,類的繼承,類成員修飾符
這篇文章主要介紹了TypeScript?學習筆記之?typeScript類定義,類的繼承,類成員修飾符,typeScript?支持面向對象的所有特性，比如類、接口等,下文詳細內容，需要的小伙伴可以參考一下2022-02-02
動態(tài)內存分配導致影響Javascript性能的問題
今天小編就為大家分享一篇關于動態(tài)內存分配導致影響Javascript性能的問題，小編覺得內容挺不錯的，現在分享給大家，具有很好的參考價值，需要的朋友一起跟隨小編來看看吧2018-12-12
這篇文章主要為大家介紹了JSON?Schema概念及使用場景示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-07-07