小程序入门体验
工作原理
小程序不是一個封裝好的html也不是一個簡單的網頁,它是一個基于微信進行二次渲染和編譯的應用,我們開發好的小程序打包放在微信的服務器上,每次我們使用小程序時,需要從微信服務器上下載下來,里面還會涉及第三方接口,也要訪問第三方服務器
發展趨勢
搭建微信小程序的開發環境
開發上線的必須要APPID,如果只是自己來用可以不用APPID
需要申請獨立的APPID
暫時先不申請APPID,我們來新建一個項目,整個項目打開之后的界面如下:
微信小程序開發工具界面
整個項目結構,做簡單的介紹,也算是自己過一遍
項目目錄
我們可以看到打開項目之后同級的目錄如下:
項目目錄
app.js 是用來監聽并處理小程序的生命周期函數、生命全局變量(通俗來說就是設置初始數據,定義事件,交互,邏輯運算,變量聲明,注釋等)
app.js
其中App()函數用來注冊一個小程序,接受一個object參數,指定小程序的生命周期函數等
app.json 是對整個小程序進行全局配置,好像只能修改導航欄的樣式,比如文字,背景顏色,文字顏色等
app.json
我們可以看到里面是一個對象,包括pages和window等屬性,其中pages來說明小程序都是由哪些頁面組成,這里只有兩個頁面一個是首頁一個是logs頁面,以后我們新建的頁面都要在這里配置下,采用的是相對路徑,window屬性不配置小程序的窗口背景顏色,導航條的樣式,還有默認的標題是什么,而且注意此json文件不可以添加任何注釋,框架中的json優先級高于全局的json優先級
app.wxss 是整個小程序的公共樣式表,優先級沒有框架中的wsxx優先級高
所以當我們啟動小程序的時候,其工作流程如下:從app.js里獲取數據,從app.wxss中獲取樣式,從app.json中讀取頁面跳轉的信息,默認跳轉pages屬性里第一個頁面,這里正好是"pages/index/index"
我們再來看pages文件夾里的內容
pages文件夾
包括兩個文件夾index和logs分別對應index頁面和log頁面,其中index.js是控制index頁面的生命周期函數或者獲取用戶數據并處理數據,響應頁面交互時間等,index.wxml是本頁面的結構類似于html,index.wxss控制本頁面的樣式,發現index文件夾里沒有index.json,默認讀取app.json,但是logs文件夾里有logs.json所以,會覆蓋掉app.json,同樣如果沒有index.wxss會默認采用app.json的樣式,如果有則覆蓋app.json
utils 該文件夾主要用來存放全局的js文件,公共的一些事件處理代碼可以放到這里,用于全局調用,如:對時間的處理等
util.js
這個公用的方法正好在logs.js里面引用了
logs.js
總結
- 上一篇: 项目管理中团队合作有多重要
- 下一篇: 特殊数学字符