目錄
- 1 分類數據源
- 2 搭建功能
- 3 創建變量讀取數據
- 4 綁定數據
- 總結
本篇我們介紹一下電商小程序的分類管理功能的開發,先看我們的原型圖:
在首頁我們是展示了四個分類的內容,采用上邊是圖標,下邊是文字的形式。使用低代碼開發,首先是需要設計數據源。
1 分類數據源
在控制臺的數據源菜單,我們創建一下分類的數據源,分別建立圖標、名稱、排序、是否在首頁展示四個字段
圖標我們使用圖片類型,這樣在后臺維護的時候就可以直接上傳圖片,而是否在首頁展示我們使用布爾值類型,這樣可以控制分類的顯示和隱藏的效果。
數據源創建好之后,需要錄入測試數據,點擊數據源的三個點功能,可以錄入測試數據
2 搭建功能
數據準備好之后,就需要開發功能了。低代碼的開發特點是使用組件進行組合,像這種有固定位置,固定數量的可以使用宮格導航組件實現。打開我們的應用,從右側的組件庫里拖入宮格導航組件來開發具體的功能
宮格導航我們的重點是先需要從數據源中讀取出數據來,為此需要創建一個變量來讀取數據
3 創建變量讀取數據
在代碼區點擊新建,創建變量,在選擇的時候選擇微搭數據表查詢
數據模型的話選擇我們剛剛創建的分類數據源
在做條件過濾的時候,考慮到我們分類是否顯示在首頁上,我們設置條件為是否顯示在首頁上等于true
4 綁定數據
變量創建好之后我們就可以給宮格導航組件綁定數據了,綁定的思路是從數據源中依次取出四條數據,分別綁定到圖標和標題的位置上
這里的細節是需要注意我們的索引,數組是通過索引來獲取元素的,索引默認是從0開始,因此我們的四條數據的索引依次為0、1、2、3。再一個就是我們的變量需要通過鏈式調用來獲取具體的屬性,依次是通data的records里獲取具體的字段信息
當這些都設置好之后,一個宮格導航組件就設置好了。當然我們這一節還沒有設置事件,通常我們宮格導航在點擊的時候需要跳轉到具體的頁面,這個功能我們在后續的篇幅中具體的實現。
總結
本篇我們介紹了分類功能的實現,先創建了分類的數據源,接著講解了組件的配置過程。低代碼的特點就是像搭積木的形式不斷的進行組件的組合最終實現出想要的效果來。