微信小程序實戰筆記-黑馬優購(p48-p82)


p48項目搭建步驟一

搭建目錄結構

 搭建項目的頁面

 p49項目搭建步驟二(引入iconfont)

 

 

 

 

 

 

 

 

 p50 項目搭建步驟三(搭建tabbar)

 

 p51項目搭建步驟四-初始化頁面樣式(微信小程序中,不支持通配符*)

 

 

 

 p52 首頁-搜索框

引入組件的三個步驟:(1)新增組件(2)聲明引用,哪個頁面文件要用到就在哪個文件的json文件中聲明(3)在頁面文件的wxml中引入

 

 

  

 

 

 

 

 

 

 

 

 

 p53首頁-獲取輪播圖數據

 

 

 

 

 

 p54-首頁-輪播圖-動態渲染

 

 p55-將原生的請求修改為promise的方式(解決回調地域的情況)

(1創建request文件,儲存index.js)

 (2)在需要請求的頁面的js文件引入

 (3)改造原生wx.request

 

 p56-首頁-分類導航

 

 

 

 

 

 

 

 

 

 

 

 p57首頁-樓層1

 

 

 

 

 

 

 

 

 

 

 

 

 

 p58 首頁-樓層2

 

 

 

 

 

 

 

 

 

 

 

 p59-分類-接口數據和頁面效果的關系

 

 

 

 p60 分類-獲取接口數據

 

 

 

 

 p61-分類-頁面布局1

 

 

 

 

 

 p62-分類-頁面布局2

 

 

 

 

 

 

 

   

 

 

 

 p63-分類-點擊菜單切換商品內容

 

 

 

 

 p64分類-使用緩存技術(因為接口返回的數據量太大了)

目的:優化用戶體驗,做法:再打開頁面的時候,判斷本地存儲中有沒有舊的數據,如果沒有,就直接發送新的請求獲取數據,如果有舊的數據,並且舊的數據沒有過期,就使用本地存儲中的舊數據

 

 

 web中的本地存儲和微信小程序的本地存儲的區別:web會轉換成字符串再出來,小程序存進去什么值,返回的也是什么值

 

 

 

 

 

 

 

 p65-分類-點擊菜單-右側列表置頂(優化)

 

 

 

 

 

 

 p66-優化接口代碼,提取公共接口路徑

 

 p67=優化接口-簡化返回值和使用es7的async

 

 

 

 

 p68商品列表-獲取分類id(點擊分類中的商品進入商品列表頁面)

 

 

 

 

 ·

 

 p69-商品列表-實現搜索框和tabs組件

 

 

 

 

 

 

 

 

 

 

 p70-商品列表-靜態樣式

 

 

 

 p71-商品列表-動態渲染

 

 

 

 

 

 

 

 

 p72-商品列表-上滑滾動條觸底加載下一頁數據

 

 

 

 

 

 

 

 

 

 p73-商品列表-下拉刷新

 

 

 

 

 

 

 

 

 

 p74-添加全局的正在加載圖標效果

 

 

 

 

 

 

 p75-商品詳情-獲取數據

 

 

 

 

 

 

 

 

 p76 商品詳情-接口數據和頁面分析

 

 

 p77-商品詳情=輪播圖動態渲染

 

 

 p78-商品詳情-價格&名稱&圖文詳情

 

 

 p79-商品詳情-優化動態渲染

 p80-商品詳情-放大預覽圖片

 

 

 

 

 p81-商品詳情-底部工具欄

 

 

 

 p82-商品詳情-加入購物車

 

 

 

 

 

 

  • 添加到短語集
     
    • 沒有此單詞集: -> 中文(簡體)...
       
    • 創建新的單詞集...
  • 拷貝


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM