這篇文章將為大家詳細講解有關(guān)微信小程序怎么使用wx.request請求服務(wù)器json數(shù)據(jù)并渲染到頁面,小編覺得挺實用的,因此分享給大家做個參考,希望大家閱讀完這篇文章后可以有所收獲。
創(chuàng)新互聯(lián)建站服務(wù)項目包括準格爾網(wǎng)站建設(shè)、準格爾網(wǎng)站制作、準格爾網(wǎng)頁制作以及準格爾網(wǎng)絡(luò)營銷策劃等。多年來,我們專注于互聯(lián)網(wǎng)行業(yè),利用自身積累的技術(shù)優(yōu)勢、行業(yè)經(jīng)驗、深度合作伙伴關(guān)系等,向廣大中小型企業(yè)、政府機構(gòu)等提供互聯(lián)網(wǎng)行業(yè)的解決方案,準格爾網(wǎng)站推廣取得了明顯的社會效益與經(jīng)濟效益。目前,我們服務(wù)的客戶以成都為中心已經(jīng)輻射到準格爾省份的部分城市,未來相信會繼續(xù)擴大服務(wù)區(qū)域并繼續(xù)獲得客戶的支持與信任!
具體如下:
微信小程序的數(shù)據(jù)總不能寫死吧,肯定是要結(jié)合數(shù)據(jù)庫來做數(shù)據(jù)更新,而小程序數(shù)據(jù)主要是json數(shù)據(jù)格式,所以我們可以利用php操作數(shù)據(jù)庫,把數(shù)據(jù)以json格式數(shù)據(jù)輸出即可?,F(xiàn)在給大家講一下,微信小程序的wx.request
進行服務(wù)器數(shù)據(jù)請求的用法:
官方文檔給出了示例代碼,但是我這邊自己進行了簡單的處理:
index.js
Page({ data: { }, onLoad: function () { var that = this wx.request({ url: 'http://www.likeyunba.com/test/test.json', headers: { 'Content-Type': 'application/json' }, success: function (res) { //將獲取到的json數(shù)據(jù),存在名字叫l(wèi)ist的這個數(shù)組中 that.setData({ list: res.data, //res代表success函數(shù)的事件對,data是固定的,list是數(shù)組 }) } }) } })
上面的url是json數(shù)據(jù)
test.json
[ { "id":"1", "title":"測試數(shù)據(jù)1" }, { "id":"2", "title":"測試數(shù)據(jù)2" }, { "id":"3", "title":"測試數(shù)據(jù)3" }, { "id":"4", "title":"測試數(shù)據(jù)4" }, { "id":"5", "title":"測試數(shù)據(jù)5" }, { "id":"6", "title":"測試數(shù)據(jù)6" }, { "id":"7", "title":"測試數(shù)據(jù)7" }, { "id":"8", "title":"測試數(shù)據(jù)8" }, { "id":"9", "title":"測試數(shù)據(jù)9" } ]
index.wxml
<view wx:for="{{list}}" wx:key="list"> <view>{{item.id}}</view> <view>{{item.title}}</view> </view>
然后wxml是首頁,渲染json數(shù)據(jù)的,這是一個for循環(huán)(wx.for
),wx:key="list"
干嘛用的?
如果我們沒有wx:key="list"
,那么在控制臺會報錯,但是這個報錯并不影響頁面的渲染,基本可以忽略掉!
Now you can provide attr "wx:key" for a "wx:for" to improve performance.這是報錯信息
wx:key
用來對列表渲染的數(shù)據(jù)指定一個"主鍵”,以加快列表渲染的速度。以下是官方文檔原話:如不提供 wx:key
,會報一個 warning, 如果明確知道該列表是靜態(tài),或者不必關(guān)注其順序,可以選擇忽略。如果你一定想去掉這個警告,可以在wx:for
的組件屬性里增加一個 wx:key="unique"
,unique請?zhí)鎿Q成數(shù)據(jù)綁定列表里的任意一個字段的字段名,比如文章列表數(shù)據(jù)中的字段“postId”,即wx:key="postId"
。不建議使用wx:key="*this"
。
關(guān)于“微信小程序怎么使用wx.request請求服務(wù)器json數(shù)據(jù)并渲染到頁面”這篇文章就分享到這里了,希望以上內(nèi)容可以對大家有一定的幫助,使各位可以學到更多知識,如果覺得文章不錯,請把它分享出去讓更多的人看到。
分享標題:微信小程序怎么使用wx.request請求服務(wù)器json數(shù)據(jù)并渲染到頁面
當前地址:http://chinadenli.net/article14/ihgpde.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供微信小程序、自適應(yīng)網(wǎng)站、外貿(mào)網(wǎng)站建設(shè)、企業(yè)網(wǎng)站制作、建站公司、云服務(wù)器
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)