夜光帶你走進 微信小程序開發(四十)擅長的領域

夜光序言:

 

 

賦予清風明月與你
相約少年遊,鮮衣怒馬。
秀髮如煙,風中清揚,
寄予流軒,月下未殤。
清風疏曠,靄靄浮光,
流光皎皎,月色溶溶。
似逢詩意少年,筆下風月無端,
自矜風采若清流。
遠山隱隱遠水粼粼,天涯遠。
歲月靜好,於你亦然。

 

 

 

 

 
 
正文:
 
                                              以道御術 / 以術識道

這裏我們來優化接口代碼

提取公共的接口路徑

 

 

export const request=(params)=>{
     //這裏,我們定義一個公共的url
     //https://api-hmugo-web.itheima.net/api/public/v1/categories
  const baseUrl = 'https://api-hmugo-web.itheima.net/api/public/v1';

      //夜光:寫一個回調函數嗯
    return new Promise((resolve,reject)=>{
        wx.request({
          ...params,
          url: baseUrl+params.url,
          //成功之後需要做什麼呢
          success:(result)=>{
            resolve(result);
          },
          //那麼失敗之後呢~
          fail:(err)=>{
            reject();
          }
        });
    })
}
//0 引入 用來發送請求的 方法 一定要把路徑補全
import { request } from"../../request/index.js";

Page({
  /**
   * 頁面的初始數據
   */
  data: {
      //輪播圖數組
      swiperList:[],
      //夜光:同理,我們再添加一個變量
      //導航數組
      cateList:[],
      //下面來一個最關鍵的
      //樓層數組
      floorList: []
  },

  /**
   * 生命週期函數--監聽頁面加載
   */
  //這個表示頁面開始加載,就會觸發的一個事件
  onLoad: function (options) {
    //1. 發送異步請求,來獲取輪播圖數據
    // wx.request({
    //   url: 'https://api-hmugo-web.itheima.net/api/public/v1/home/swiperdata',
    //   success: (res)=>{
    //      console.log(res);
    //     //我們通過下面這個方法進行賦值
    //     this.setData({
    //       swiperList:res.data.message
    //     })
    //   }
    // });
    
    this.getSwiperList(); //夜光:方法已經封裝好了
    this.getCateList(); //夜光:方法已經封裝好了
    this.getFloorList(); //夜光:方法已經封裝好了
  },

  //下面我們再做個~~
  //夜光:獲取輪播圖數據的方法
  getSwiperList(){
    request({
      url: '/home/swiperdata'
    })
      .then(res => {
        //我們通過下面這個方法進行賦值
        this.setData({
          swiperList: res.data.message
        })
        //是不是感覺上面這個方法很酷炫

      })
  },

  //夜光:獲取導航的方法
  getCateList() {
    request({
      url: '/home/catitems'
    })
      .then(res => {
        //我們通過下面這個方法進行賦值
        this.setData({
          cateList: res.data.message
        })
        //是不是感覺上面這個方法很酷炫
      })
  },

  //夜光:獲取導航的方法
  getFloorList() {
    request({
      url: '/home/floordata'
    })
      .then(res => {
        //我們通過下面這個方法進行賦值
        this.setData({
          floorList: res.data.message
        })
        //是不是感覺上面這個方法很酷炫
      })
  }



})

 

 

 

 

我們以前寫web的時候,一個關鍵的東西,叫做url傳參

 

 

我們添加一個編譯模式

用來實現每次第一個頁面都是商品列表頁面

剛剛失誤了,忘記添加一個參數,啓動的參數

 

 

 

 

 

 

 

 

 

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章