微信小程序開發(fā)入門之框架結(jié)構(gòu)

2022-11-17    分類: 網(wǎng)站建設(shè)

網(wǎng)站建設(shè)- 建站教程 - 微信小程序 - 微信小程序開發(fā)入門之框架結(jié)構(gòu)

首先明白一點,小程序基本開發(fā)基于MVC,即模型,視圖,控制器,模型層在這里表現(xiàn)的不是很明顯,大部分時候都以全局變量(或頁面局部變量)的形式存在,一般存在與控制器中。視圖在此為.wxml文件所表示的,它將控制器得到的數(shù)據(jù)和wxml文件進行組合,渲染。而視圖與控制器的交互可通過綁定事件的形式觸發(fā)控制器各個函數(shù)的執(zhí)行,大部分事件會傳遞目標(biāo)節(jié)點對象作為參數(shù)。數(shù)據(jù)交互可通過能傳遞值的組件或響應(yīng)綁定事件來解決。下面分部分介紹開發(fā)方法。

新建項目,首先會建立小程序主控制邏輯與配置文件,其中包括app.js(控制小程序邏輯,響應(yīng)生命周期回掉函數(shù)操作,全局變量的定義等),app.json(小程序窗口,特性配置等,像下拉刷新,導(dǎo)航欄配置,tabBar等。),app.wxss(樣式配置)。

app.json文件配置:

遵循json文件格式規(guī)范,通過配置此文件可以設(shè)置小程序的特性。文件如下圖:

pages(數(shù)組):用于配置小程序頁面文件,添加新的頁面,必需配置此屬性。window:用于配置小程序窗口特性,包括背景顏色,風(fēng)格,導(dǎo)航欄,是否啟用下拉刷新等。

window屬性中可通過tabs配置tabBar,如下示例:

各個屬性含義如下:

App.js文件說明:

此文件用于注冊小程序,使用方法App(),接收object參數(shù),初始化小程序,如下圖:

其中onLaunch,onShow,onHide用于響應(yīng)生命周期回掉,也可自定義全局變量及方法。

object參數(shù)說明:

前臺、后臺定義:當(dāng)用戶點擊左上角關(guān)閉,或者按了設(shè)備Home鍵離開微信,小程序并沒有直接銷毀,而是進入了后臺;當(dāng)再次進入微信或再次打開小程序,又會從后臺進入前臺。

只有當(dāng)小程序進入后臺一定時間,或者系統(tǒng)資源占用過高,才會被真正的銷毀。

注冊頁面

如果說上面的只是對整個小程序的配置注冊,這里的具體的頁面操作才是和用戶交互的真正載體,每個頁面都可單獨存放一個文件夾,方便管理,同時WAService會將此文件夾中的頁面樣式文件進行渲染。每個頁面都由js文件進行控制,wxml進行布局,wxss就是樣式設(shè)置了。用于響應(yīng)生命周期方法有onLoad(監(jiān)聽頁面加載),onReady(監(jiān)聽頁面初次渲染完成),onShow(監(jiān)聽頁面顯示),onHide(監(jiān)聽頁面隱藏),onUnload(監(jiān)聽頁面卸載),示例如下:

其中data為頁面初始數(shù)據(jù),也是視圖綁定數(shù)據(jù)的來源,視圖中的變量都會從data的值中找到相對應(yīng)的進行替換。程序中可通過this.data訪問到data中的值,但不直接設(shè)置,因為需要通知更新視圖中的數(shù)據(jù),如自行直接設(shè)置,則視圖數(shù)據(jù)與此設(shè)置過的數(shù)據(jù)就不一致了,這里可以通過this.setData()方法進行設(shè)置,接受object對象。還有一個方法onPullDownRefreash,用于監(jiān)聽頁面的下拉刷新操作,可用于更新數(shù)據(jù),wx.stopPullDownRefresh()停止刷新動畫。

視圖層

即wxml文件的相關(guān)操作,WXML(WeiXinMarkupLanguage)是框架設(shè)計的一套標(biāo)簽語言,與html/xml有極大相似性。


網(wǎng)頁標(biāo)題:微信小程序開發(fā)入門之框架結(jié)構(gòu)
文章分享:http://m.kartarina.com/news9/214309.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)頁設(shè)計公司軟件開發(fā)做網(wǎng)站小程序開發(fā)外貿(mào)網(wǎng)站建設(shè)微信公眾號

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)

網(wǎng)站建設(shè)網(wǎng)站維護公司
主站蜘蛛池模板: 国产亚洲精品a在线无码| 国产嫖妓一区二区三区无码| 一区二区三区无码视频免费福利| 国产精品成人无码免费| 色欲AV无码一区二区三区| 久久精品无码av| 久久国产亚洲精品无码| 精品久久久久久无码人妻蜜桃| 无码内射中文字幕岛国片| 无码永久免费AV网站| 亚洲色偷拍另类无码专区| 亚洲国产精品无码久久98| 自慰无码一区二区三区| 内射人妻无码色AV天堂| 日韩人妻精品无码一区二区三区| 亚洲AV无码一区二区三区性色 | 国产福利无码一区在线| 国产精品热久久无码av| 69天堂人成无码麻豆免费视频| 中日精品无码一本二本三本| 无码人妻丰满熟妇区五十路| 国产成A人亚洲精V品无码| 日韩少妇无码一区二区三区| 在线观看亚洲AV每日更新无码| 人妻无码一区二区三区| 亚洲AV无码AV日韩AV网站| 亚洲精品无码永久中文字幕| 成人无码Av片在线观看| 97性无码区免费| 无码囯产精品一区二区免费| 中文字幕无码免费久久| yy111111电影院少妇影院无码| 精品久久久久久无码中文字幕一区| 少妇人妻偷人精品无码视频| 亚洲一区无码中文字幕| 亚洲中文久久精品无码| 亚洲AV综合色区无码一区| 亚洲色中文字幕无码AV| 无码专区中文字幕无码| 亚洲综合无码一区二区| 无码人妻一区二区三区在线视频|