微信小程序開(kāi)發(fā)時(shí),如何做可以少走彎路
分享 2020.05.12 瀏覽次數(shù):5138次
今天,杭州帷拓科技來(lái)給大家介紹提升代碼質(zhì)量問(wèn)題的法寶,讓大家可以少走一點(diǎn)彎路:
一、 小程序開(kāi)發(fā)工具介紹
1.小程序開(kāi)發(fā)工具的下載地址
在正式開(kāi)發(fā)之前需要安裝微信小程序的開(kāi)發(fā)工具。
2.小程序開(kāi)發(fā)工具的界面
下載完成后直接安裝。
與傳統(tǒng)的IDE界面布局風(fēng)格不同,菜單欄在左側(cè)的豎條,分為編輯、調(diào)試、和項(xiàng)目。編輯區(qū)可以對(duì)當(dāng)前項(xiàng)目進(jìn)行代碼編寫(xiě)和文件的添加、刪除以及重命名等基本操作。
工具目前提供了5種文件類(lèi)型的編輯:wxml、wxss、js、json以及圖片文件,擁有自動(dòng)保存、自動(dòng)補(bǔ)齊、實(shí)時(shí)預(yù)覽等功能。
二、 小程序的項(xiàng)目結(jié)構(gòu)介紹
1. 組成小程序項(xiàng)目的元素
再來(lái)說(shuō)一下項(xiàng)目結(jié)構(gòu),整個(gè)項(xiàng)目由以幾部分組成:
app.js 主要是全局公共的js方法聲明及調(diào)用所在的文件,是小程序的腳本代碼。我們可以在這個(gè)文件中監(jiān)聽(tīng)并處理小程序的生命周期函數(shù)、聲明全局變量。程序從“骨架”成為“血肉之軀”的正是js的作用。js做一些動(dòng)態(tài)的東西,比如請(qǐng)求數(shù)據(jù),控制元素上下移動(dòng),判斷用戶(hù)輸入密碼是否安全等等。
app.json 是是對(duì)整個(gè)小程序的全局配置。所有的頁(yè)面都要在此注冊(cè),不然不允許訪(fǎng)問(wèn)。我們可以在這個(gè)文件中配置小程序是由哪些頁(yè)面組成,配置小程序的窗口背景色,配置導(dǎo)航條樣式,配置默認(rèn)標(biāo)題。
app.wxss 是小程序全局的css文件,是整個(gè)小程序的公共樣式表。我們可以在頁(yè)面組件的 class 屬性上直接使用 app.wxss 中聲明的樣式規(guī)則。
pages下是對(duì)應(yīng)著所有頁(yè)面,每個(gè)頁(yè)面可以添加以上三種類(lèi)型的文件。另外還有wxml類(lèi)型文件。wxml是一種類(lèi)xml的結(jié)構(gòu)化文本,描述了小程序頁(yè)面有哪些元素,比如一個(gè)文章需要有標(biāo)題、作者、時(shí)間、正文,但是不關(guān)心這些元素怎么排列。
utils 是我們公共的js存放的地方,因?yàn)槲⑿判〕绦蛞?,每個(gè)js文件里的方法不可以直接引用或調(diào)用,必須要用 module.exports方法導(dǎo)出,這樣pages 下的.js文件才可以調(diào)用到我們?cè)谶@里寫(xiě)的js方法。
attachment下存放的是圖片等資源文件(單個(gè)不大于1M)。
2. 如何編寫(xiě)js文件?
那么以上語(yǔ)法規(guī)則最復(fù)雜的就是js文件,下面我們重點(diǎn)了解一下js文件。
2.1 app.js文件
app.js是整個(gè)小程序的入口文件,也是控制整個(gè)小程序生命周期的文件。App.js用App()來(lái)實(shí)現(xiàn)對(duì)整個(gè)程序的注冊(cè),同時(shí)App()里面還實(shí)現(xiàn)了對(duì)小程序生命周期的監(jiān)控函數(shù):
當(dāng)用戶(hù)點(diǎn)擊左上角關(guān)閉,或者按了設(shè)備 Home 鍵離開(kāi)微信,小程序并沒(méi)有直接銷(xiāo)毀,而是進(jìn)入了后臺(tái);當(dāng)再次進(jìn)入微信或再次打開(kāi)小程序,又會(huì)從后臺(tái)進(jìn)入前臺(tái)。只有當(dāng)小程序進(jìn)入后臺(tái)一定時(shí)間,或者系統(tǒng)資源占用過(guò)高,才會(huì)被真正的銷(xiāo)毀。簡(jiǎn)單地說(shuō),前臺(tái)就是你在操作小程序時(shí);后臺(tái)就是你離開(kāi)了小程序,去打開(kāi)其他手機(jī)服務(wù)時(shí),這時(shí)小程序就隱藏到后臺(tái)。
2.2 index.js文件
小程序中每一個(gè)頁(yè)面可以放在一個(gè)文件夾中,這個(gè)文件夾中一般包括4個(gè)文件:.js, .json, .wxml, .wxss。官方建議這四個(gè)文件的名字最好和文件夾的名字一致,這樣便于框架自動(dòng)查找。
每個(gè)頁(yè)面都需要注冊(cè),index.js用Page()這個(gè)函數(shù)來(lái)注冊(cè)一個(gè)頁(yè)面,它接受一個(gè)object參數(shù),用這個(gè)參數(shù)來(lái)指定頁(yè)面的初始數(shù)據(jù),生命周期函數(shù),事件處理函數(shù)。
希望能夠?qū)δ阌幸恍椭丁?/p>
- PREV:無(wú)
- NEXT:不懂代碼也可以進(jìn)行微信小程序開(kāi)發(fā)嗎?
-
杭州APP定制:選擇合適開(kāi)發(fā)公司的重要性
日期:2024-12-20瀏覽次數(shù):291次
-
杭州app開(kāi)發(fā):如何選擇專(zhuān)業(yè)開(kāi)發(fā)公司?
日期:2024-12-20瀏覽次數(shù):293次
-
杭州定制小程序公司:小程序行業(yè)的未來(lái)趨勢(shì)
日期:2024-12-20瀏覽次數(shù):289次
-
杭州小程序開(kāi)發(fā)公司:如何運(yùn)營(yíng)小程序以吸引更多客戶(hù)
日期:2024-12-13瀏覽次數(shù):604次
-
杭州app定制公司:如何打造網(wǎng)站建設(shè)第一品牌的特色?
日期:2024-12-13瀏覽次數(shù):601次
相關(guān)新聞
整合同類(lèi)新聞,相關(guān)新聞一手掌握
-
許昌做網(wǎng)站:企業(yè)網(wǎng)站建設(shè),這幾點(diǎn)你一定要知道!
日期:2020-11-11瀏覽次數(shù):1914次
-
許昌網(wǎng)站制作|企業(yè)網(wǎng)站建設(shè)流程有哪些?企業(yè)網(wǎng)站建設(shè)
日期:2020-11-11瀏覽次數(shù):1907次
-
許昌做網(wǎng)站:五個(gè)正被淘汰的網(wǎng)頁(yè)設(shè)計(jì)趨勢(shì)
日期:2020-10-22瀏覽次數(shù):1945次
-
許昌網(wǎng)站制作:一個(gè)好的網(wǎng)站設(shè)計(jì)具有什么特點(diǎn)
日期:2020-10-22瀏覽次數(shù):1910次
最新新聞
與互聯(lián)網(wǎng)同行,實(shí)時(shí)掌握網(wǎng)建行業(yè)最新動(dòng)態(tài)
-
解析網(wǎng)站的容錯(cuò)性設(shè)計(jì)原則
日期:2016-06-28瀏覽次數(shù):5008次
-
企業(yè)網(wǎng)站建設(shè)如何設(shè)計(jì)網(wǎng)頁(yè)
日期:2019-12-20瀏覽次數(shù):4840次
-
網(wǎng)絡(luò)棋牌平臺(tái),如何讓用戶(hù)愛(ài)上你的營(yíng)銷(xiāo)活動(dòng)
日期:2020-01-10瀏覽次數(shù):4886次
-
漳州app開(kāi)發(fā)的幾個(gè)設(shè)計(jì)標(biāo)準(zhǔn)
日期:2021-02-07瀏覽次數(shù):1864次
-
杭州app開(kāi)發(fā)之視頻app為用戶(hù)帶來(lái)的體驗(yàn)
日期:2021-07-06瀏覽次數(shù):3731次
隨機(jī)新聞
新聞新動(dòng)態(tài),您需要的新聞管家
洞悉市場(chǎng)趨勢(shì)演變讓傳播回歸社會(huì)
免費(fèi)獲取網(wǎng)站建設(shè)與網(wǎng)絡(luò)推廣方案報(bào)價(jià)
-
關(guān)于我們
杭州帷拓科技有限公司,是一家新型的全案網(wǎng)絡(luò)開(kāi)發(fā)公司,作為以互聯(lián)網(wǎng)高端網(wǎng)站建設(shè)、APP開(kāi)發(fā)、小程序開(kāi)發(fā)為核心的專(zhuān)業(yè)網(wǎng)絡(luò)技術(shù)服務(wù)供應(yīng)商,帷拓科技致力于全面分析市場(chǎng)環(huán)境、衡量與預(yù)測(cè)市場(chǎng)需求、整合區(qū)別于行業(yè)競(jìng)爭(zhēng)對(duì)手的絕對(duì)優(yōu)勢(shì),結(jié)合品牌理念深度挖掘項(xiàng)目?jī)?yōu)勢(shì)和產(chǎn)品價(jià)值,提升客戶(hù)品牌認(rèn)知、認(rèn)可度。
-
我們的客戶(hù)
帷拓科技?xì)v經(jīng)十年沉淀,與國(guó)內(nèi)外上千家客戶(hù)達(dá)成合作關(guān)系,其中穩(wěn)定合作的公司有:浙江華為、浙江移動(dòng)、浙江5G產(chǎn)業(yè)聯(lián)盟、浙江省社科院、綠城足球俱樂(lè)部、娃哈哈雙語(yǔ)學(xué)校、健康中國(guó)杭州峰會(huì)、科雷機(jī)電等,帷拓科技始終堅(jiān)持“帷有專(zhuān)業(yè),才能拓展無(wú)限”的服務(wù)理念,堅(jiān)持“認(rèn)真堅(jiān)持細(xì)節(jié)”的優(yōu)質(zhì)服務(wù)理念,不斷完善自身,成就企業(yè),最終實(shí)現(xiàn)共贏。
-
我們的業(yè)務(wù)
帷拓科技主營(yíng)業(yè)務(wù)范圍包含互聯(lián)網(wǎng)高端網(wǎng)站建設(shè)、APP開(kāi)發(fā)、小程序開(kāi)發(fā)、商城網(wǎng)站建設(shè)、公眾號(hào)運(yùn)營(yíng)以及數(shù)字營(yíng)銷(xiāo)等,涵蓋了服務(wù)、房產(chǎn)、數(shù)碼、服裝、物流貿(mào)易等行業(yè),根據(jù)品牌現(xiàn)狀,為每個(gè)客戶(hù)量身定制項(xiàng)目整體服務(wù)方案,以敏銳的市場(chǎng)洞察力、創(chuàng)新的市場(chǎng)策劃能力,全面把握市場(chǎng)變化,為客戶(hù)實(shí)現(xiàn)從企業(yè)到消費(fèi)者的價(jià)值轉(zhuǎn)換。