首先介紹下小程序的學習過程,我是一個客服端開發 對小程序一直很感興趣,正趕上 公司要開發小程序,就一邊學習一邊開發,寫下這個博客,希望能和大家一起成長。
如果還對小程序不了解 可以去看微信公眾平臺看文檔,這里就不介紹開發工具的安裝了 https://mp.weixin.QQ.com/debug/wxadoc/dev/
小程序開發框架的目標是通過盡可能簡單、高效的方式讓開發者可以在微信中開發具有原生 APP 體驗的服務。
框架提供了自己的視圖層描述語言 Wxml 和 WXSS,以及基于 javaScript 的邏輯層框架,并在視圖層與邏輯層間提供了數據傳輸和事件系統,可以讓開發者可以方便的聚焦于數據與邏輯上。
今天先介紹下網絡請求的方式,微信提供了方法
wx.request({ url: 'https://URL', data: {}, method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT // header: {}, // 設置請求的 header success: function(res){ // success }, fail: function() { // fail }, complete: function() { // complete } })
fetch(url, data, callback) { wx.request({ url: url, data: data, method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT header: { "Content-Type": "application/json" }, // 設置請求的 header success: function(res){ // success callback(null,res.data); }, fail: function() { // fail callback(e) }, complete: function() { // complete wx.hideNavigationBarLoading(); } })
然后在想要用到的頁面中調用就可以了
首先調用app.js的方法引用var app = getApp()
然后在onLoad中調用app.fetch("https:", {}, (err, data) => { that.setData({picList:data.data})});
Constant.Main_ScrollPic_URL是我的URL 我把它放在了constant.js中,獲取的數據我放到了picList數組中下邊是我的請求總代碼
var Constant = require('../../utils/constant.js');var app = getApp()Page({ data:{ totalPage:"", list:[], picList:[], refreshTextStr:"", isRefresh:true }, onLoad:function(options){ // 頁面初始化 options為頁面跳轉所帶來的參數 var that = this; // 封裝的請求 app.fetch(Constant.Main_ScrollPic_URL, {}, (err, data) => { that.setData({picList:data.data})}); requestData(that); }
新聞熱點
疑難解答