微信小程序(1)

微信小程序(1) 瞭解微信小程序

---

1. 下載並安裝微信小程序IDE

1.官網註冊https://mp.weixin.qq.com/，並下載相應的IDE。
2.運行下載的安裝包

3.根據一般安裝方法安裝微信小程序的IDE

一直按照默認配置安裝即可。

---

2. 微信小程序項目框架了解

1.創建項目，沒有AppID的話，只是部分功能受限，不會太影響我們如今的學習。如果需要上傳小程序的話，需要個人去註冊並申請相應的AppID。

2.建立“普通快速啓動模板”，其項目目錄如下：

• app.js——整個項目的啓動文件
  註釋寫的onlaunch方法有三大功能：

  • 瀏覽器緩存進行存和取數據
  • 用登陸成功的回調
  • 獲取用戶信息

  globalData是定義整個項目的全局變量或者常量。
  此外，若需要調用API的時候，一般我們會在該文件中的定義一些API變量，如API: "https://api.douban.com"，之後在需要某個頁面調用該API的時候，使用app.globaData.API就能夠使用該變量。
  【爲了整個項目的維護，還是建議把這種公用參數統一寫在配置文件中】

• app.json——整個項目的配置文件

  • 註冊頁面
  • 配置tab頁
  • 設置整個項目的樣式
  • 頁面標題等等

  注意：小程序啓動默認的第一個頁面，就是app.json的pages中的第一個頁面。

• pages——小程序的頁面組件
  有幾個頁面就會有幾個子文件夾。
  在快速啓動模板中，就有兩個頁面，index和logs
• index目錄——index頁面
  有三個文件，與web開發的文件是一一對應的
  
  • index.wxml -> index.html
  • index.wxss -> index.css
  • index.js(js文件)
    js文件中的部分函數解釋：
    
    • var app = getApp();
      引入整個項目的app.js文件，用來取期中的公共變量等信息
    • 整個page({})中，第一個data，就是本頁面組件的內部數據，會渲染到該頁面的wxml文件中(類似於vue、react)，通過setData修改data數據，驅動頁面渲染
    • 一些生命週期函數
    • onload() (監聽頁面加載)
    • onready() (頁面初次渲染)
    • onshow() (頁面顯示)
    • onhide() (頁面隱藏)
    • onShareAppMessage() (設置頁面分享的信息)
    • …… (更多的可查官網API)
  • .json文件
    作爲該頁面組件的配置文件，設置頁面標題等功能。
    json中不能寫註釋，不然容易出錯。