微信小程序開發介紹微信開發者工具以及小程序框架

小編給大家分享一下微信小程序開發介紹微信開發者工具以及小程序框架，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

（一）微信開發者工具

小程序團隊推出了自己的開發工具-微信開發者工具，目前微信開發者工具任然在不斷的完善中，在開發小程序時經常要不斷的更新。論壇上吐槽的文章也是一大堆，存在很多bug，筆者在開發過程中也是被它坑過。筆者是安卓開發者，習慣于這種可視化的編程，所以沒有選擇Webstrom或者其他開發工具，接下來將介紹微信開發者工具基本功能。

1. 機型選擇：小程序以IPhone6的屏幕尺寸為設計標準，讓UI小姐姐按照IPhone6屏幕尺寸來切圖。

2. 預覽界面：寫好視圖布局后點擊編譯，視圖界面刷新顯示

3. 遠程調試：手機端和PC端開發工具聯調（非常實用）

4. 上傳代碼：上傳到騰訊服務器，提交審核必經步驟?？梢蕴顚懓姹咎柡蛡渥⑿畔?/p>

5. 5-1：代碼體積，微信限制 2M 以內。  5-2：ES語法轉換，開發中一般不校驗合法域名信息 。5-3：域名信息：小程序后臺要做配置服務器域名，有request 域名，socket 域名以及uploadFile和downloadFile域名。注意：域名小程序要求必須是https

6. 控制臺：打印輸出信息，方便調試

7. 資源文件：對應項目的文件目錄，一般可以在這里進行斷點調試

8. 本地數據存儲：顯示的是本地存儲的數據，對應的相關API是wx.setStorageSync(key,data)

9. 視圖調試：標組件以子父層級結構呈現，方便調試。

以上就是在開發過程中微信開發者工具常用到的功能，微信開發者工具也在不斷的完善，為了以后更好的提升開發效率，也需要我們在開發過程中將遇到的問題不斷的反饋給小程序團隊做優化，希望大家抱著包容的心態。開發過程中大家也可以依照自己的習慣選擇其他的開發工具。

（二）小程序框架以及目錄結構介紹

• 邏輯層
  
  

  小程序開發框架的邏輯層由 JavaScript 編寫。邏輯層將數據進行處理后發送給視圖層，同時接受視圖層的事件反饋。邏輯層對應的是js文件，在每個頁面的js文件中，系統提供了一系列的方法如：頁面生命周期onLoad(),onShow(),onHide(),等，下拉刷新onPullDownRefresh()，頁面到底部（上拉加載）onReachBottom()方法，分享功能onShareAppMessage()等。

  
  

• 視圖層
  
  

  框架的視圖層由 wxml 與  wxss 編寫，由組件來進行展示。將邏輯層的數據反應成視圖，同時將視圖層的事件發送給邏輯層。 wxml 由小程序提供的組件組成，wxss 是css 樣式。
  
  

• app文件
  
  app.json 文件用來對微信小程序進行全局配置，決定頁面文件的路徑、窗口表現、設置網絡超時時間、設置多 tab 等。頁面的json文件一般用來配置當前頁面的窗口表現。app.js 用來提供全局變量，如baseUrl。app.wxss 提供全局的css樣式
  
  

  {
    "pages": [                    //頁面的路徑(在此處可快捷創建頁面)
      "pages/index/index",
      "pages/logs/index"
    ],
    "window": {                   //視圖窗口
      "navigationBarTitleText": "Demo"
    },
    "tabBar": {                   //底部tab
      "list": [{
        "pagePath": "pages/index/index",
        "text": "首頁"
      }, {
        "pagePath": "pages/logs/logs",
        "text": "日志"
      }]
    },
    "networkTimeout": {           //設置是否超時
      "request": 10000,
      "downloadFile": 10000
    },
    "debug": true
  }

• utils/.json
  
  系統提供的工具類，一般編寫公共的方法導出方便其他頁面調用。

以上是“微信小程序開發介紹微信開發者工具以及小程序框架”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注億速云行業資訊頻道！