簡易開發
app.js、app.json、app.wxss
.js后綴的是腳本文件,
.json后綴的文件是配置文件,
.wxss后綴的是樣式表文件。
微信小程序會讀取這些文件,并生成[小程序實例](https://mp.weixin.qq.com/debug/wxadoc/dev/framework/app-service/app.html)。
app.js說明
app.js是小程序的腳本代碼。我們可以在這個文件中監聽并處理小程序的生命周期函數、聲明全局變量。
調用框架提供的豐富的 API,如本例的同步存儲及同步讀取本地數據。想了解更多可用 API,
可參考 [API 文檔](https://mp.weixin.qq.com/debug/wxadoc/dev/api/)
app.json說明
app.json 是對整個小程序的全局配置。
我們可以在這個文件中配置小程序是由哪些頁面組成,配置小程序的窗口背景色,配置導航條樣式,配置默認標題。
注意該文件不可添加任何注釋。更多可配置項可參考[配置詳解](https://mp.weixin.qq.com/debug/wxadoc/dev/framework/config.html)
app.wxss
app.wxss 是整個小程序的公共樣式表。我們可以在頁面組件的 class 屬性上直接使用 app.wxss 中聲明的樣式規則。
創建頁面
微信小程序中的每一個頁面的【路徑+頁面名】都需要寫在 app.json 的 pages 中,且 pages 中的第一個頁面是小程序的首頁。
圖例1-1
單獨的頁面說明
每一個[小程序頁面](https://mp.weixin.qq.com/debug/wxadoc/dev/framework/app-service/page.html)
是由同路徑下同名的四個不同后綴文件的組成,如:index.js、index.wxml、index.wxss、index.json。
.js后綴的文件是腳本文件,
.json后綴的文件是配置文件,
.wxss后綴的是樣式表文件,
.wxml后綴的文件是頁面結構文件。
圖例1-2
index.js說明
index.js
是頁面的腳本文件,在這個文件中我們可以監聽并處理頁面的生命周期函數、獲取小程序實例,聲明并處理數據,響應頁面交互事件等。
index.wxss 說明
index.wxss 是頁面的樣式表:
注意:注意!!!!!
頁面的樣式表是非必要的。當有頁面樣式表時,頁面的樣式表中的樣式規則會層疊覆蓋 app.wxss 中的樣式規則。
如果不指定頁面的樣式表,也可以在頁面的結構文件中直接使用 app.wxss 中指定的樣式規則。
index.json
index.json 是頁面的配置文件:
注意:注意!!!!!
頁面的配置文件是非必要的。當有頁面的配置文件時,配置項在該頁面會覆蓋 app.json 的 window 中相同的配置項。如果沒有指定的頁面配置文件,則在該頁面直接使用 app.json 中的默認配置。
怎么手機瀏覽
圖例1-3