小程序基礎(chǔ)語法
配置
app.json中的pages數(shù)組第一項(xiàng)為默認(rèn)首頁
-
window模塊包含屬性
`
"backgroundTextStyle":"light",
"navigationBarBackgroundColor": "#fff",
"navigationBarTitleText": "C'est la vie",
"navigationBarTextStyle":"black",
"backgroundColor":"red",
"enablePullDownRefresh":"false",
"onReachBottomDistance":"20px"`
-
tabBar標(biāo)簽欄
attr type bool describe color HexColor 是 tab 上的文字默認(rèn)顏色 selectedColor HexColor 是 tab 上的文字選中時(shí)的顏色 backgroundColor HexColor 是 tab 的背景色 borderStyle String 否 black tabbar上邊框的顏色擅笔, 僅支持 black/white list Array 是 tab 的列表溉瓶,詳見 list 屬性說明,最少2個(gè)、最多5個(gè) tab position String 否 bottom 可選值 bottom、top -
pages.json 覆蓋全局配置
attr type bool describe navigationBarBackgroundColor HexColor #000000 導(dǎo)航欄背景顏色读整,如"#000000" navigationBarTextStyle String white 導(dǎo)航欄標(biāo)題顏色蚀苛,僅支持 black/white navigationBarTitleText String C'est la vie 導(dǎo)航欄標(biāo)題文字內(nèi)容 backgroundColor HexColor #ffffff 窗口的背景色 backgroundTextStyle String dark 下拉背景字體、loading 圖的樣式炊林,僅支持 dark/light enablePullDownRefresh Boolean false 是否開啟下拉刷新,詳見頁面相關(guān)事件處理函數(shù)卷要。 disableScroll Boolean false 設(shè)置為 true 則頁面整體不能上下滾動(dòng)渣聚;只在 page.json 中有效,無法在 app.json 中設(shè)置該項(xiàng) onReachBottomDistance Number 50 頁面上拉觸底事件觸發(fā)時(shí)距頁面底部距離僧叉,單位為px DEMO
{ "navigationBarBackgroundColor": "#ffffff", "navigationBarTextStyle": "black", "navigationBarTitleText": "微信接口功能演示", "backgroundColor": "#eeeeee", "backgroundTextStyle": "light" }
邏輯層
js基礎(chǔ)結(jié)構(gòu)修改
<p>
* 增加 App 和 Page 方法奕枝,進(jìn)行程序和頁面的注冊(cè)。
* 增加 getApp 和 getCurrentPages 方法瓶堕,分別用來獲取 App 實(shí)例和當(dāng)前頁面棧隘道。
* 提供豐富的 API,如微信用戶數(shù)據(jù)郎笆,掃一掃谭梗,支付等微信特有能力。
* 每個(gè)頁面有獨(dú)立的作用域宛蚓,并提供模塊化能力激捏。
* 由于框架并非運(yùn)行在瀏覽器中,所以 JavaScript 在 web 中一些能力都無法使用凄吏,如 document远舅,window 等。
* 開發(fā)者寫的所有代碼最終將會(huì)打包成一份 JavaScript痕钢,并在小程序啟動(dòng)的時(shí)候運(yùn)行图柏,直到小程序銷毀。類似 ServiceWorker任连,所以邏輯層也稱之為 App Service蚤吹。
</p>-
注冊(cè)程序
App函數(shù)用來注冊(cè)一個(gè)小程序,用于初始化课梳,接收object參數(shù)距辆,指定小程序的生命周期函數(shù)
屬性 類型 描述 觸發(fā)時(shí)機(jī) onLaunch Function 生命周期函數(shù)--監(jiān)聽小程序初始化 當(dāng)小程序初始化完成時(shí),會(huì)觸發(fā) onLaunch(全局只觸發(fā)一次) onShow Function 生命周期函數(shù)--監(jiān)聽小程序顯示 當(dāng)小程序啟動(dòng)暮刃,或從后臺(tái)進(jìn)入前臺(tái)顯示跨算,會(huì)觸發(fā) onShow onHide Function 生命周期函數(shù)--監(jiān)聽小程序隱藏 當(dāng)小程序從前臺(tái)進(jìn)入后臺(tái),會(huì)觸發(fā) onHide onError Function 錯(cuò)誤監(jiān)聽函數(shù) 當(dāng)小程序發(fā)生腳本錯(cuò)誤椭懊,或者 api 調(diào)用失敗時(shí)诸蚕,會(huì)觸發(fā) onError 并帶上錯(cuò)誤信息 其他 Any 開發(fā)者可以添加任意的函數(shù)或數(shù)據(jù)到 Object 參數(shù)中步势,用 this 可以訪問 -
注冊(cè)頁面
Page函數(shù)注冊(cè)一個(gè)頁面,接收一個(gè)object參數(shù)背犯,指定頁面的初始數(shù)據(jù)坏瘩,生命周期函數(shù),事件處理函數(shù)
屬性 類型 描述 data Object 頁面的初始數(shù)據(jù) onLoad Function 生命周期函數(shù)--監(jiān)聽頁面加載 onReady Function 生命周期函數(shù)--監(jiān)聽頁面初次渲染完成 onShow Function 生命周期函數(shù)--監(jiān)聽頁面顯示 onHide Function 生命周期函數(shù)--監(jiān)聽頁面隱藏 onUnload Function 生命周期函數(shù)--監(jiān)聽頁面卸載 onPullDownRefresh Function 頁面相關(guān)事件處理函數(shù)--監(jiān)聽用戶下拉動(dòng)作 onReachBottom Function 頁面上拉觸底事件的處理函數(shù) onShareAppMessage Function 用戶點(diǎn)擊右上角轉(zhuǎn)發(fā) onPageScroll Function 頁面滾動(dòng)觸發(fā)事件的處理函數(shù) onTabItemTap Function 當(dāng)前是 tab 頁時(shí)漠魏,點(diǎn)擊 tab 時(shí)觸發(fā) 其他 Any 開發(fā)者可以添加任意的函數(shù)或數(shù)據(jù)到 object 參數(shù)中倔矾,在頁面的函數(shù)中用 this 可以訪問
初始化數(shù)據(jù),必須是json格式
` <view>{{text}}</view> <view>{{array[0].msg}}</view> Page({ data: { text: 'init data', array: [{msg: '1'}, {msg: '2'}] } }) `
生命周期函數(shù)
wait
markdown 表格模板
| attr | type | bool | describe
| :--: | : -- : | :--: | : -- :
|color | HexColor | 是 | tab 上的文字默認(rèn)顏色
| selectedColor | HexColor | 是 | tab 上的文字選中時(shí)的顏色
| backgroundColor | HexColor | 是 | tab 的背景色
| borderStyle | String | 否 | black tabbar上邊框的顏色black/white
|list | Array | 是 | tab 的列,最少2個(gè)柱锹、最多5個(gè) tab
|position | String | 否 | bottom 可選值 bottom哪自、top