小程序模板網(wǎng)

微信小程序開(kāi)發(fā)教程第三章:項(xiàng)目結(jié)構(gòu)以及配置

發(fā)布時(shí)間:2018-03-20 09:37 所屬欄目:小程序開(kāi)發(fā)教程

找到創(chuàng)建的 demo 文件夾,把項(xiàng)目導(dǎo)入到你的編輯器,這里使用的是Sublime Text編輯器。這個(gè)時(shí)候需要根據(jù)自己的項(xiàng)目需求結(jié)構(gòu)進(jìn)行更改了,項(xiàng)目根目錄下面是首頁(yè)渲染的幾個(gè) tabBar 頁(yè)面,以及 app 的一些配置文件,如名 ...

 
 
 

找到創(chuàng)建的 demo 文件夾,把項(xiàng)目導(dǎo)入到你的編輯器,這里使用的是Sublime Text編輯器。

 

 

玩轉(zhuǎn)微信應(yīng)用號(hào),「小程序」開(kāi)發(fā)實(shí)操指南第二彈

 

 

這個(gè)時(shí)候需要根據(jù)自己的項(xiàng)目需求結(jié)構(gòu)進(jìn)行更改了,項(xiàng)目根目錄下面是首頁(yè)渲染的幾個(gè) tabBar 頁(yè)面,以及 app 的一些配置文件,如名片盒項(xiàng)目的 tabBar 是 3 個(gè)切換菜單

 

 

玩轉(zhuǎn)微信應(yīng)用號(hào),「小程序」開(kāi)發(fā)實(shí)操指南第二彈

 

 

我們先找到 app.json 文件打開(kāi)配置好這幾個(gè)菜單,配置好 tabBar,這個(gè)直接把配置文件改成你自己設(shè)計(jì)的即可。

 

 

玩轉(zhuǎn)微信應(yīng)用號(hào),「小程序」開(kāi)發(fā)實(shí)操指南第二彈

 

 

App.json 里面有幾個(gè)配置項(xiàng):

 

 

* Pages:這個(gè)是編寫(xiě)的js文件,后綴.js這里不需要使用,配置好正確路徑即可正常調(diào)用(若調(diào)用不到,在重啟微信開(kāi)發(fā)者工具會(huì)直接報(bào) page 錯(cuò)誤)。
* Window:配置頂部的一些樣式,文檔介紹比較詳細(xì)。
* tabBar:底部的幾項(xiàng)配置,見(jiàn)名知意。
* networkTimeout:暫時(shí)沒(méi)發(fā)現(xiàn)用處,建議看文檔。根據(jù)實(shí)際項(xiàng)目需求進(jìn)行添加與更改。
* iconPath和selectedIconPath:底部菜單按鈕圖片與得到切換點(diǎn)擊高亮。
* text:可以去掉,全部去掉會(huì)發(fā)現(xiàn)底部 tabar 高度會(huì)減少很多。 

 

 

玩轉(zhuǎn)微信應(yīng)用號(hào),「小程序」開(kāi)發(fā)實(shí)操指南第二彈

 

 

Json 文件配置好后,根據(jù)項(xiàng)目進(jìn)行文件創(chuàng)建。
Demo:存放的是假數(shù)據(jù),這一期的開(kāi)發(fā)工具支持 require,假數(shù)據(jù)使用的是 .js 文件形式,
里面的數(shù)據(jù)結(jié)構(gòu) json 一致,把 data 暴露出去即可

 

 

玩轉(zhuǎn)微信應(yīng)用號(hào),「小程序」開(kāi)發(fā)實(shí)操指南第二彈

 

 

玩轉(zhuǎn)微信應(yīng)用號(hào),「小程序」開(kāi)發(fā)實(shí)操指南第二彈        然后取數(shù)據(jù) require 進(jìn)來(lái)即可,這一點(diǎn)使用很方便;
Images:圖片路徑;
Page:除 tabar 以外的頁(yè)面;
Servise:服務(wù)交付層(與后臺(tái)聯(lián)調(diào)真實(shí)數(shù)據(jù)時(shí)使用);
Wxss:一些公共的 css 文件;
看到這里大家發(fā)現(xiàn)每個(gè)頁(yè)面都被連帶好三個(gè)不同的后綴。分別頁(yè)面,css,js 目前只能依照這樣,是微信應(yīng)用號(hào)的一個(gè)規(guī)范吧。

 

 

玩轉(zhuǎn)微信應(yīng)用號(hào),「小程序」開(kāi)發(fā)實(shí)操指南第二彈

 

 

Wxss 文件是引入你寫(xiě)的樣式文件,也可以直接在里面寫(xiě)樣式。

 

 

玩轉(zhuǎn)微信應(yīng)用號(hào),「小程序」開(kāi)發(fā)實(shí)操指南第二彈

 

 

Js 文件需全部配置到 pages 里面才能生效。

 

 

玩轉(zhuǎn)微信應(yīng)用號(hào),「小程序」開(kāi)發(fā)實(shí)操指南第二彈



易優(yōu)小程序(企業(yè)版)+靈活api+前后代碼開(kāi)源 碼云倉(cāng)庫(kù):starfork
本文地址:http://22321a.com/wxmini/doc/course/22733.html 復(fù)制鏈接 如需定制請(qǐng)聯(lián)系易優(yōu)客服咨詢(xún):800182392 點(diǎn)擊咨詢(xún)
QQ在線咨詢(xún)