微信小程式 專案實戰(二)board 首頁

2021-09-07 16:26:22 字數 836 閱讀 4884

1.專案結構

2.頁面

(1)資料(邏輯)

board.js

// pages/board/board.js

page(,

/*** 生命週期函式--監聽頁面載入

*/onload: function (options) ,

header: ,

success: function(res))}})

}})

(2)布局

board.wxml

豆瓣電影榜單集合

最新,最in的影視資訊收集~

正在熱映

即將上映

top250

北美票房榜

(3)樣式

board.wxss

/* pages/board/board.wxss */

.slide swiper

.slide-image

.title-wrap

.title-wrap .title

.title-wrap .desc

.board

.board .board-item

.board text

.board image

3.效果圖

微信小程式入門到實戰(二)

上一文章裡面,我們實現了第乙個小程式頁面,並且了解到了一些小程式的知識,接下來繼續開始我們的學習。wx.redirectto wx.switchtab wx switchtab 路徑可得注意寫對,區分絕對路徑和相對路徑 絕對路徑 一般在前面加上 表示從根目錄開始往下尋找 相對路徑 相對於當前頁面來說...

微信小程式實戰入門

一 簡介 參考 二 工程 參考 quickstart basic file.html 工具設計介面可調整機型 顯示百分比 資料連線方式。三 發布 個人上線了乙個木材材積計算器 兩天做的,有web前後端經驗很容易入手,有增加 共計 記錄功能 審核很快,一天審核結束 後來發現已經之前有公司做了,尷尬,而...

微信小程式開發實戰第二講

正如你所體驗,頁面的展示不外乎列表 tab多標籤這種第一視覺感知。但是實際上css中頁面的布局反應到每乙個小檢視上,都有自己的布局方式。這裡我們只講我們後面要用到的一種布局 flex box布局,即現代化的彈性布局,所有瀏覽器都支援,所有移動裝置都支援,並且高效簡單,只要你理解了,一切就都ok了。組...