資訊專欄INFORMATION COLUMN
摘要：在新建一個(gè)項(xiàng)目后，微信小程序會(huì)生成一個(gè)默認(rèn)的程序框架，后續(xù)程序的開發(fā)工作都在這個(gè)框架上進(jìn)行。微信小程序的開發(fā)模式確實(shí)和開發(fā)很相似。通常一個(gè)完整的微信小程序包含上面兩部分，當(dāng)然我們也可以定義自己的目錄用于存放公共代碼和程序需要的其它文件。
在上一篇教程的最后，我們生成了一個(gè)類似"Hello World"的小程序，這個(gè)過程中沒有編寫任何一行代碼。
在新建一個(gè)項(xiàng)目后，微信小程序會(huì)生成一個(gè)默認(rèn)的程序框架，后續(xù)程序的開發(fā)工作都在這個(gè)框架上進(jìn)行。這個(gè)默認(rèn)框架包含下面幾部分：
每個(gè)微信小程序都會(huì)包含app.js, app.json, app.wxss 三個(gè)文件，其中app.js文件包含了程序的邏輯實(shí)現(xiàn)代碼，app.json是一個(gè)全局配置文件，app.wxss是一個(gè)全局樣式文件。后面會(huì)詳細(xì)介紹每個(gè)文件的內(nèi)容和作用。
pages 目錄pages目錄包含了程序當(dāng)前的頁(yè)面文件，以默認(rèn)生成的程序?yàn)槔?，該目錄下包含了index，logs兩個(gè)目錄，說(shuō)明程序包括index和logs兩個(gè)頁(yè)面。
以index為例，該目錄下包含index.js，index.wxss，index.wxml3個(gè)文件，其中js是代碼文件，wxss是樣式文件，wxml是頁(yè)面結(jié)構(gòu)描述文件。
熟悉web開發(fā)的同學(xué)應(yīng)該會(huì)感覺很熟悉。微信小程序的開發(fā)模式確實(shí)和web開發(fā)很相似。目前邏輯部分僅支持javascript語(yǔ)言，并使用wxml(類似html)和wxss(類似css)來(lái)描述頁(yè)面的結(jié)構(gòu)和樣式。此處的javascript和web中是完全一樣的，但因?yàn)椴皇沁\(yùn)行在瀏覽器環(huán)境中，因此無(wú)法使用 windows，document等對(duì)象，自然也無(wú)法使用jquery等第三方庫(kù)。而wxml，wxss的語(yǔ)法和html，css也是十分相近的。
頁(yè)面也同樣可以包含一個(gè)index.json文件用于配置，不過這不是必須的。
通常一個(gè)完整的微信小程序包含上面兩部分，當(dāng)然我們也可以定義自己的目錄用于存放公共代碼和程序需要的其它文件。
app.json打開app.json文件,可以看到如下代碼
{
"pages":[
"pages/index/index",
"pages/logs/logs"
],
"window":{
"backgroundTextStyle":"light",
"navigationBarBackgroundColor": "#fff",
"navigationBarTitleText": "WeChat",
"navigationBarTextStyle":"black"
}
}
其中pages部分包含了程序的頁(yè)面，這樣框架就能知道從哪里找到頁(yè)面文件。而window部分包含了程序窗口的一些配置。詳細(xì)的配置項(xiàng)可以參考配置 小程序
app.wxssapp.wxss文件包含了全局的樣式信息，在默認(rèn)生成的程序中，只有一個(gè)類選擇器.container，該類型在index.wxml和 logs.wxml中有使用到。
app.js該文件包含了程序的主體流程代碼實(shí)現(xiàn)，關(guān)于該部分的分析請(qǐng)見下一篇教程。
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/80937.html
摘要：在之前的教程中寫到，微信小程序框架將程序分為邏輯層文件和視圖層文件。關(guān)于數(shù)據(jù)綁定的更多講述，敬請(qǐng)期待微信小程序開發(fā)教程基礎(chǔ)篇數(shù)據(jù)綁定下 在之前的教程中寫到，微信小程序框架將程序分為邏輯層(.js文件)和視圖層(.wxml文件)。這是一種常見的UI和邏輯分離的程序設(shè)計(jì)方式，開發(fā)出來(lái)的程序更加靈活，易擴(kuò)展。 這種程序設(shè)計(jì)方式通常要解決兩個(gè)問題: UI層響應(yīng)邏輯層邏輯和數(shù)據(jù)的變化UI層將用戶...
摘要：微信小程序應(yīng)用號(hào)開發(fā)資源匯總文檔工具教程代碼插件組件文檔從搭建一個(gè)微信小程序開始小程序開發(fā)文檔小程序設(shè)計(jì)指南工具小程序開發(fā)者工具官方支持微信小程序?qū)崟r(shí)預(yù)覽的支持的微信小程序組件化開發(fā)框架轉(zhuǎn)在線工具小程序云端增強(qiáng)社區(qū)微信小程序 微信(小程序or應(yīng)用號(hào))開發(fā)資源匯總-文檔-工具-教程-代碼-插件-組件 文檔 從搭建一個(gè)微信小程序開始 小程序開發(fā)文檔 小程序設(shè)計(jì)指南 工具 小程序開發(fā)者...
閱讀 2405·2021-11-18 10:07
閱讀 2348·2021-09-22 15:59
閱讀 3115·2021-08-23 09:42
閱讀 2313·2019-08-30 15:44
閱讀 1224·2019-08-29 15:06
閱讀 2363·2019-08-29 13:27
閱讀 1252·2019-08-29 13:21
閱讀 1452·2019-08-29 13:13
