微信小程序頁(yè)面開發(fā)注意事項(xiàng)整理
小程序的開發(fā)注意事項(xiàng):
1、js文件
每個(gè)頁(yè)面對(duì)應(yīng)的js文件可以定義頁(yè)面onReady,onLoad,onShow,onHide,onUnload,還有頁(yè)面的數(shù)據(jù),自定義的函數(shù)要寫到一塊,內(nèi)部約定是都寫到默認(rèn)函數(shù)的后面。既“頁(yè)面中先data,再默認(rèn)函數(shù),再自定義函數(shù)”方便review code,提高協(xié)作效率。
2、json文件
默認(rèn)不能為空,即使沒(méi)有內(nèi)容也要為空數(shù)據(jù){},原先定義在app.json中的內(nèi)容,如果需要在當(dāng)前頁(yè)面中重新定義,那么只要把內(nèi)容復(fù)制過(guò)來(lái),直接賦新值即可,用于設(shè)置小程序的狀態(tài)欄、導(dǎo)航條、標(biāo)題、窗口背景色。常用的是頁(yè)面的標(biāo)題
{
"navigationBarTitleText": "我的",
"selfdata":"全棧工程師師不靠譜更新",
"tabBar": {
"list": [{
"pagePath": "pagePath",
"text": "text",
"iconPath": "iconPath",
"selectedIconPath": "selectedIconPath"
}],
"position":"top"
}
}
見慣了菜單在底部的,來(lái)一個(gè)在top吧。
3、wxml文件
頁(yè)面頭部和底部需要封裝好,做成模版,分別導(dǎo)入入頁(yè)面
<import src="/pages/common/head.wxml"/> <import src="/pages/common/foot.wxml"/>
之前HTML編寫的好習(xí)慣還是要帶入進(jìn)來(lái)有head還有foot,當(dāng)然業(yè)務(wù)內(nèi)容就body,每一塊就用一個(gè)view包裝起來(lái),方便控制布局和class
頁(yè)面加載的時(shí)候獲取數(shù)據(jù),從網(wǎng)絡(luò)或從緩存中,數(shù)據(jù)再通過(guò)頁(yè)面的data中定義的內(nèi)容在頁(yè)面渲染。具體的呈現(xiàn)列表、條件這些多多的使用。
4、wxss文件
@import "common.wxss";
公共樣式、reset樣式要根據(jù)不同項(xiàng)目提前管理好,不要使用px,不要使用px,不要使用px,重要的事情要說(shuō)三遍,小程序?yàn)榱吮WC兼容和自適應(yīng)使用了新的單位rpx
5、要提供一個(gè)供用戶清理本地緩存的按鈕。相當(dāng)于項(xiàng)目的reset開關(guān),緩存數(shù)據(jù)、文件數(shù)據(jù)、授權(quán)數(shù)據(jù)這些可能要不同項(xiàng)目中用到。
感謝閱讀,希望能幫助到大家,謝謝大家對(duì)本站的支持!
- 微信小程序網(wǎng)絡(luò)請(qǐng)求wx.request詳解及實(shí)例
- 微信小程序?qū)崿F(xiàn)錨點(diǎn)定位樓層跳躍的實(shí)例
- 微信小程序城市定位的實(shí)現(xiàn)實(shí)例(獲取當(dāng)前所在國(guó)家城市信息)
- 微信小程序如何獲知用戶運(yùn)行小程序的場(chǎng)景教程
- 微信小程序中做用戶登錄與登錄態(tài)維護(hù)的實(shí)現(xiàn)詳解
- 微信小程序之?dāng)?shù)據(jù)雙向綁定與數(shù)據(jù)操作
- 微信小程序圖片選擇、上傳到服務(wù)器、預(yù)覽(PHP)實(shí)現(xiàn)實(shí)例
- 微信小程序 setData使用方法及常用錯(cuò)誤解決辦法
相關(guān)文章
微信小程序左右滑動(dòng)切換頁(yè)面詳解及實(shí)例代碼
這篇文章主要介紹了微信小程序左右滑動(dòng)切換頁(yè)面詳解及實(shí)例代碼的相關(guān)資料,需要的朋友可以參考下2017-02-02
JS屬性scrollTop?clientHeight?scrollHeight理解學(xué)習(xí)
這篇文章主要為大家介紹了JS屬性scrollTop?clientHeight?scrollHeight理解學(xué)習(xí),有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-07-07
Typescript類型系統(tǒng)FLOW靜態(tài)檢查基本規(guī)范
這篇文章主要為大家介紹了Typescript語(yǔ)言的類型系統(tǒng)FLOW靜態(tài)檢查基本規(guī)范,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-05-05
TypeScript編寫自動(dòng)創(chuàng)建長(zhǎng)度固定數(shù)組的類型工具詳解
這篇文章主要為大家介紹了TS編寫自動(dòng)創(chuàng)建長(zhǎng)度固定數(shù)組的類型工具詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-08-08
JS前端可視化canvas動(dòng)畫原理及其推導(dǎo)實(shí)現(xiàn)
這篇文章主要為大家介紹了JS前端可視化canvas動(dòng)畫原理及其推導(dǎo)實(shí)現(xiàn),有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-08-08

