微信小程序初探(二、分頁數據請求)


             大家好 波哥小猿又來啦[斜眼笑],昨天咱們講了微信小程序簡單數據請求,有沒有照着教程實現請求的同學們啦 實現的同學舉個爪[笑臉]。哈哈,好了不扯犢子啦,我相信有的同學已經實現了簡單的數據請求,沒有實現小程序數據請求的也沒關系,大家在我文章里評論我會耐心給大家答復得,爭取讓看我文章的小伙伴都能學會小程序開發,突然覺得好有成就感[偷笑]。

            昨天咱們講了小程序的簡單數據請求,我相信大家心里會想,不就簡單的數據請求嗎,有能耐講點難得...[捂臉]。正所謂千呼萬喚使出來,本着為用戶考慮的角度,我決定講點復雜的啦,各位小伙伴搬着小板凳坐穩啦哈,前方高能預警無關人員請閃到一邊

       是的,他來啦,小程序分頁請求數據閃亮登場啦

 

一、對開發人員的要求

    (一)、開發人員需要會一些Mysql數據庫的簡單數據腳本編寫,比如 select * from [table],或者select * from table where [條件] order by [column] 等 一些簡單的數據腳本,這些東西可以在網上查詢到,這些不是本文討論重點,但是你得會,基礎薄弱的課后自行 問度娘學習

    (二)、會了上面這些東西還不夠,還得學習一下一個ORM,就是knex.js框架,小程序就是用knex.js框架來訪問數據庫的

     以上這些就是本堂課的基礎,小伙伴記下來了嗎

二、好了下面開始展示代碼啦,老鐵們坐穩啦

     本次數據還是以上篇文章的brandmodeltab表為例,如果需要數據腳本的,可以在評論或者私信里回復,我會給大家的

     (一)、后台代碼展示

          所謂后台代碼其實就是所謂的接口啦,也就是咱們用后端Node.js如何訪問數據庫啦

          我的代碼是這樣的,大家請看

          

         代碼知識點總結:

       1、后端接收小程序前端的請求參數,代碼展示如下

       

        后端(Node.js)接收前端(小程序)請求參數 用的是ctx.query 來接收的 返回的是一個Json數據和前端(小程序)請求的字段是一一對應的

       2、利用knex.js框架對Mysql數據庫做分頁處理,代碼如下

       

          注意,重點哈

          這段代碼重點就是 limit 和 offset的理解,請各位看官記好

           ①、數據庫數據計算是從0開始的

           ②、offset 指定要返回的第一行的偏移量,初始行的偏移量是0(不是1)

           ③、limit 指定返回行的最大數目

            例如:select * from brandmodeltab limit 10 offset 0,這段腳本的意思是,取brandmodeltab表前十條數據0,,10條,因為偏移量offset 為0

                       select * from brandmodeltab limit 10 offset 10,這段腳本的意思是,取brandmodeltab表前十條數據11,,20條,因為偏移量offset 為10

 

           好了舉一反三,相信經過上面這些知識點的講解大家會理解上面 服務端的代碼得,大家現在是不是有點感覺

 

        沒關系哈,對於一些基礎薄弱的同學,確實到現在會感覺蒙蒙得(因為我文章最開始的知識你還沒學[捂臉],補完那些知識應該會好理解一些我寫的代碼),學心東西嗎 肯定費點勁,不過不要灰心,大家在評論里留言我會給大家耐心解答得。好了我們接着要搞事情啦 

     

      (二)、前端代碼展示

         1、頁面初始字段定義

 

   這里我在初始的data字段里面定義了初始的字段用來請求數據用的,具體字段釋義請看注釋

    2、定義統一的請求函數fetchBeiDengList()函數

3、在頁面的下拉刷新事件和上拉加載事件的處理

    4、頁面數據渲染

展示效果如下所示

     好了到此前端的數據展示就完結了,因為前端的代碼我大部分都在代碼里面做了注釋 此處就不在一一解釋啦,大家看注釋就好,好了相信有不少小伙伴已經躍躍欲試啦,大家請開始自己的小程序編寫吧,哈哈

    咱們下期再見,拜拜

對了,走過路過不要錯過,記得點下關注呦

 

 

 

 

 

      

            

 


免責聲明!

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



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