微信小程序?qū)W習(xí)總結(jié)(一)項(xiàng)目創(chuàng)建與目錄結(jié)構(gòu)分析
本文實(shí)例講述了微信小程序項(xiàng)目創(chuàng)建與目錄結(jié)構(gòu)。分享給大家供大家參考,具體如下:
首先,放上微信公眾品臺(tái)的網(wǎng)址https://mp.weixin.qq.com/,下面內(nèi)容完全可以跟著做。https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/devtools.html
下載開(kāi)發(fā)工具。
創(chuàng)建項(xiàng)目
如圖所示
選點(diǎn)此校驗(yàn)就行啦,右邊有個(gè)詳情也點(diǎn)開(kāi)瞅兩眼。
上傳測(cè)試和騰訊這塊點(diǎn)不了是為啥呢,因?yàn)槟銊?chuàng)建項(xiàng)目的時(shí)候沒(méi)有填寫(xiě)AppID,下一題。
具體的東西下載下來(lái)瞅瞅點(diǎn)點(diǎn)就行。下面介紹結(jié)構(gòu)。
目錄結(jié)構(gòu)
1.wxml相當(dāng)于html,wxss相當(dāng)于css
2.在 app.json 的 pages 字段,添加需要新建的頁(yè)面的路徑,將會(huì)自動(dòng)生成改頁(yè)面所需要的文件
同樣里面也會(huì)生成四個(gè)文件,且與文件名同名的文件。
3.ctrl+s相當(dāng)于點(diǎn)擊編譯
4.外面的四個(gè)文件相當(dāng)于全局文件,那么是聽(tīng)誰(shuí)的呢,當(dāng)然是就近原則了,離誰(shuí)近受誰(shuí)影響
例子:在index.wxml寫(xiě)上這么一句<text>hello world </text>
,在index.wxss中寫(xiě)上text{ color:red; }
,在全局wxss中寫(xiě)text{ color:blue; }
,結(jié)果顏色為紅色啦。
5.json文件是來(lái)干嘛的呢。我們來(lái)看官方的解釋。app.json文件用來(lái)對(duì)微信小程序進(jìn)行全局配置,決定頁(yè)面文件的路徑、窗口表現(xiàn)、設(shè)置網(wǎng)絡(luò)超時(shí)時(shí)間、設(shè)置多 tab 等。
第一部分pages
接受一個(gè)數(shù)組,每一項(xiàng)都是字符串,來(lái)指定小程序由哪些頁(yè)面組成。每一項(xiàng)代表對(duì)應(yīng)頁(yè)面的【路徑+文件名】信息,數(shù)組的第一項(xiàng)代表小程序的初始頁(yè)面。小程序中新增/減少頁(yè)面,都需要對(duì) pages 數(shù)組進(jìn)行修改。
第二部分window
用于設(shè)置小程序的狀態(tài)欄、導(dǎo)航條、標(biāo)題、窗口背景色。
很給力!
希望本文所述對(duì)大家微信小程序設(shè)計(jì)有所幫助。
- 微信小程序 條件渲染詳解
- 微信小程序 教程之條件渲染
- 微信小程序教程系列之視圖層的條件渲染(10)
- 微信小程序利用button控制條件標(biāo)簽的變量問(wèn)題
- 微信小程序?qū)W習(xí)總結(jié)(二)樣式、屬性、模板操作分析
- 微信小程序 引用其他js文件實(shí)現(xiàn)代碼
- 詳解微信小程序入門(mén)五: wxml文件引用、模版、生命周期
- 微信小程序如何引用外部js,外部樣式,公共頁(yè)面模板
- 微信小程序視圖template模板引用的實(shí)例詳解
- 微信小程序引用公共js里的方法的實(shí)例詳解
- 微信小程序 教程之引用
- 微信小程序?qū)W習(xí)總結(jié)(三)條件、模板、文件引用實(shí)例分析
相關(guān)文章
javascript 網(wǎng)頁(yè)進(jìn)度條簡(jiǎn)單實(shí)例
這篇文章主要介紹了javascript 網(wǎng)頁(yè)進(jìn)度條簡(jiǎn)單實(shí)例的相關(guān)資料,需要的朋友可以參考下2017-02-02baidu博客的編輯友情鏈接的新的層窗口!經(jīng)典~支持【FF】
baidu博客的編輯友情鏈接的新的層窗口!經(jīng)典~支持【FF】...2007-02-02js中top、clientTop、scrollTop、offsetTop的區(qū)別 文字詳細(xì)說(shuō)明版
之前在修改IE6下的一個(gè)顯示bug時(shí),查到過(guò)這些,貼這備忘,后面給出了詳細(xì)說(shuō)明,以前的版本,沒(méi)仔細(xì)的說(shuō)明,特希望大家也收藏下。2011-01-01修改layui的后臺(tái)模板的左側(cè)導(dǎo)航欄可以伸縮的方法
今天小編就為大家分享一篇修改layui的后臺(tái)模板的左側(cè)導(dǎo)航欄可以伸縮的方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-09-09JavaScript算法題之如何將一個(gè)數(shù)組旋轉(zhuǎn)k步
這篇文章主要給大家介紹了關(guān)于JavaScript算法題之如何將一個(gè)數(shù)組旋轉(zhuǎn)k步的相關(guān)資料,文中通過(guò)實(shí)例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2022-03-03