這篇文章主要介紹了微信小程序（應(yīng)用號(hào)）簡(jiǎn)單實(shí)例應(yīng)用的相關(guān)資料,需要的朋友可以參考下
Demo 預(yù)覽
演示視頻（流量預(yù)警 2.64MB）
GitHub Repo 地址
倉(cāng)庫(kù)地址：https://github.com/zce/weapp-demo
使用步驟
將倉(cāng)庫(kù)克隆到本地：
bash $ git clone https://github.com/zce/weapp-demo.git weapp-douban –depth 1 $ cd weapp-douban
打開微信Web開放者工具（注意：必須是0.9.092300版本）
必須是0.9.092300版本，之前的版本不能保證正常運(yùn)行
不需要所謂的破解，網(wǎng)上所謂的破解只是針對(duì)之前的0.9.092100版本，新的官方版本不需要破解，不需要破解，不需要破解！
下載鏈接（官方版本，放心下載）：https://pan.baidu.com/s/1qYld6Vi
wechat_web_devtools_0.9.092300_x64.exe（Windows 64位）
wechat_web_devtools_0.9.092300_ia32.exe（Windows 32位）
wechat_web_devtools_0.9.092300.dmg（macOS）
1.選擇添加項(xiàng)目，填寫或選擇相應(yīng)信息
AppID：點(diǎn)擊右下角無AppID（我也沒有資格，據(jù)說這次200個(gè)名額是小龍欽點(diǎn)的）
項(xiàng)目名稱：隨便填寫，因?yàn)椴簧婕暗讲渴穑詿o所謂
項(xiàng)目目錄：選擇剛剛克隆的文件夾
點(diǎn)擊添加項(xiàng)目
新年快樂，恭喜發(fā)財(cái)
你可以選擇在微信Web開放者工具中編碼（也可選擇你喜歡的編輯器）
1.通過左下角重啟按鈕，刷新編碼過后的預(yù)覽
2.Bash用戶可以通過在項(xiàng)目目錄下執(zhí)行以下命令快速創(chuàng)建新組件所需文件：
bash $ ./generate page
# or $ ./generate component
剩下的可以自由發(fā)揮了
微信小程序基本教程（持續(xù)更新）
創(chuàng)建一個(gè)項(xiàng)目文件夾，創(chuàng)建基本所需文件
app.js
項(xiàng)目主入口文件（用于創(chuàng)建應(yīng)用程序?qū)ο螅?
// App函數(shù)是一個(gè)全局函數(shù)，用于創(chuàng)建應(yīng)用程序?qū)ο?App({
// ========== 全局?jǐn)?shù)據(jù)對(duì)象（整個(gè)應(yīng)用程序共享） ==========
globalData: { ... },
// ========== 應(yīng)用程序全局方法 ==========
method1 (p1, p2) { ... },
method2 (p1, p2) { ... },
// ========== 生命周期方法 ==========
// 應(yīng)用程序啟動(dòng)時(shí)觸發(fā)一次
onLaunch () { ... },
// 當(dāng)應(yīng)用程序進(jìn)入前臺(tái)顯示狀態(tài)時(shí)觸發(fā)
onShow () { ... },
// 當(dāng)應(yīng)用程序進(jìn)入后臺(tái)狀態(tài)時(shí)觸發(fā)
onHide () { ... }
})
app.json
項(xiàng)目配置聲明文件（指定項(xiàng)目的一些信息，比如導(dǎo)航欄樣式顏色等等）
{
// 當(dāng)前程序是由哪些頁(yè)面組成的（第一項(xiàng)默認(rèn)為初始頁(yè)面）
// 所有使用到的組件或頁(yè)面都必須在此體現(xiàn)
// https://mp.weixin.qq.com/debug/wxadoc/dev/framework/config.html#pages
"pages": [ ... ],
// 應(yīng)用程序窗口設(shè)置
// https://mp.weixin.qq.com/debug/wxadoc/dev/framework/config.html#window
"window": { ... },
// 應(yīng)用導(dǎo)航欄設(shè)置
// https://mp.weixin.qq.com/debug/wxadoc/dev/framework/config.html#tabBar
"tabBar": { ... },
// 網(wǎng)絡(luò)超時(shí)設(shè)置
// https://mp.weixin.qq.com/debug/wxadoc/dev/framework/config.html#networkTimeout
"networkTimeout": {},
// 是否在控制臺(tái)輸出調(diào)試信息
// https://mp.weixin.qq.com/debug/wxadoc/dev/framework/config.html#debug
"debug": true
}
app.wxss
[!可選!]項(xiàng)目全局的樣式文件，內(nèi)容遵循CSS標(biāo)準(zhǔn)語法
創(chuàng)建頁(yè)面組件
每個(gè)頁(yè)面組件也分為四個(gè)文件組成：
-
page-name.js
-
頁(yè)面邏輯文件，用于處理頁(yè)面生命周期控制和數(shù)據(jù)處理
-
未完待續(xù)…
-
page-name.json
-
設(shè)置當(dāng)前頁(yè)面工作時(shí)的一些配置
-
此處可以覆蓋app.json中的window設(shè)置
-
也就是說只可以設(shè)置window中設(shè)置的熟悉
-
未完待續(xù)…
-
page-name.wxml
-
wxml指的是Wei Xin Markup Language
-
用于定義頁(yè)面中元素結(jié)構(gòu)的
-
語法遵循XML語法，注意是XML語法，不是HTML語法，不是HTML語法，不是HTML語法
-
未完待續(xù)…
-
page-name.wxss
-
wxml指的是Wei Xin Style Sheet
-
用于定義頁(yè)面樣式的
-
語法遵循CSS語法，擴(kuò)展了CSS基本用法和長(zhǎng)度單位（主要就是rpx響應(yīng)式像素）
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，更多相關(guān)內(nèi)容請(qǐng)關(guān)注PHP中文網(wǎng)！
相關(guān)推薦：
以上就是微信小程序（應(yīng)用號(hào)）簡(jiǎn)單應(yīng)用的詳細(xì)內(nèi)容，更多請(qǐng)關(guān)注有卡有網(wǎng)。
