微信小程序是什么 微信小程序怎么申請(qǐng) 微信小程序怎么申請(qǐng)

微信小程序申請(qǐng)前的準(zhǔn)備：

　　首先， 你需要注冊(cè)一個(gè)小程序賬號(hào)。 需要用一個(gè)沒(méi)注冊(cè)過(guò)公眾號(hào)的郵箱注冊(cè)。 注冊(cè)過(guò)程中需要很多認(rèn)證， 比較繁瑣。 如果暫時(shí)只是試水、沒(méi)有發(fā)布的打算， 那么只要完成基本信息填寫就可以， 不需要完成微信認(rèn)證。

　　之后， 就可以在公眾平臺(tái)使用注冊(cè)的帳戶進(jìn)行登錄。

　　然后， 在主頁(yè)面左邊列表中點(diǎn)擊設(shè)置， 再設(shè)置頁(yè)面中選開發(fā)設(shè)置， 就可以看到AppID。 而AppID 可以用于在開發(fā)工具中進(jìn)行登記， 使用開發(fā)工具的高級(jí)功能。 你可以到官網(wǎng)下載開發(fā)工具。

　　開始項(xiàng)目：

　　打開開發(fā)者工具， 選擇小程序選項(xiàng)， 然后直接點(diǎn)擊「添加項(xiàng)目」按鈕。 我們可以在這個(gè)步驟， 填入剛才注冊(cè)的時(shí)候使用的 AppID。

　　如果項(xiàng)目目錄中的文件是個(gè)空文件夾， 會(huì)提示是否創(chuàng)建 quick start 項(xiàng)目。

　　選擇「是」， 開發(fā)者工具會(huì)幫助我們?cè)陂_發(fā)目錄里生成一個(gè)簡(jiǎn)單的 Demo。

　　這個(gè) Demo 擁有一個(gè)完整的小程序的大概框架。

　　1. 框架

　　我們首先看一下官方提供的 Demo 含有的目錄：

　　app.js：小程序邏輯、生命周期、全局變量。

　　app.json：小程序公共設(shè)置、導(dǎo)航欄顏色等， 不可以注釋。

　　app.wxss：小程序公共樣式， 類似 CSS 。

　　小程序頁(yè)面構(gòu)成類似這樣：

　　每一個(gè)小程序頁(yè)面是由同路徑下同名的四個(gè)不同后綴文件的組成， 如：index.js、index.wxml、index.wxss、index.json

　　微信小程序中的每一個(gè)頁(yè)面的路徑和頁(yè)面文件名， 都需要寫在app.json的pages中， 且pages數(shù)組中的第一個(gè)頁(yè)面是小程序的首頁(yè)。

　　這四個(gè)文件按照功能可以分成三個(gè)部分：

　　配置：json 文件

　　邏輯層：js 文件

　　視圖層：wxss.wxml 文件

　　在 iOS 上， 小程序的邏輯代碼運(yùn)行于 JavaScriptCore 中， 而在 Android上， 這個(gè)任務(wù)則是交給 X5 內(nèi)核來(lái)完成。

　　在 開發(fā)工具上， 小程序的 JavaScript 代碼是運(yùn)行在 NW.js(Chrome 內(nèi)核) 中。 這也導(dǎo)致開發(fā)工具上的效果跟實(shí)際效果有所出入。

　　2. 組件

　　微信提供了許多組件， 主要分為八種:

　　這其中， 包含了view、scroll-view、button、form等普通常用的組件， 也提供了地圖mapcanvas

　　組件主要屬于視圖層， 通過(guò) WXML 來(lái)進(jìn)行結(jié)構(gòu)布局， 類似于 HTML。 樣式則通過(guò) WXSS 來(lái)定義和修改， 它的語(yǔ)法和使用都近似 CSS。

　　組件使用語(yǔ)法實(shí)例：

　　3. API

　　網(wǎng)絡(luò)

　　媒體

　　數(shù)據(jù)

　　位置

　　設(shè)備

　　界面

　　開發(fā)接口

　　網(wǎng)絡(luò)請(qǐng)求接口包含了普通的 HTTPS 請(qǐng)求， 支持上傳、下載、Socket， 基本上滿足了我們開發(fā)中所需要的網(wǎng)絡(luò)需求。

　　這些 API 屬于邏輯層， 寫在 JS 邏輯文件中。

　　使用實(shí)例：

　　wx.getLocation({ type: 'wgs84', success: function(res) { var latitude = res.latitude var longitude = res.longitude var speed = res.speed var accuracy = res.accuracy } })

　　可以到官方文檔 – API 查看其它 API 的使用方法。

　　編譯運(yùn)行

　　1. 模擬器調(diào)試

　　我們可以在微信提供的開發(fā)者工具中， 使用模擬器查看小程序運(yùn)行的效果。

　　之前我們提過(guò)， 小程序的運(yùn)行底層不同， 這也導(dǎo)致在模擬器上的效果， 會(huì)與在手機(jī)上運(yùn)行有些差異。

　　2. 真機(jī)調(diào)試

　　在左邊的選項(xiàng)欄中， 選擇項(xiàng)目， 然后點(diǎn)預(yù)覽會(huì)生產(chǎn)一個(gè)二維碼， 用管理員微信號(hào)掃一掃， 就可以在真機(jī)上看實(shí)際效果。