<big id="haewi"></big>
  • <span id="haewi"></span>
      <big id="haewi"></big>
      1. 首页 >> 開發技術咨詢 >>技術相關 >> 成都微信小程序入門開發教程
        详细内容

        成都微信小程序入門開發教程

        當你準備開發一個微信小程序的時候,你首先需要一個小程序的 APPId ,在微信公眾號官網可以獲得。(暫時只有官方邀請的才可以獲得)。


        你還需要準備微信開發者工具,官網同樣有下載,下載安裝即可,支持windows,linux,和MAC平臺。

        小程序使用的微信自己開發 MINA 框架,提供了視圖層描述語言,WXML 和 WXSS 以及基于JavaScript的邏輯層框架,并在視圖層與邏輯層間提供了數據傳輸和事件系統,可以讓開發者可以方便的聚焦于數據與邏輯上。

        打開的時候會自動提示創建一個demo,demo結構文件樹如下:

        微信小程序開發入門

        其中app.js、app.json、app.wxss 是必不可少的,是小程序生成的依賴文件。

        app.js 監聽并控制這整個程序的生命周期,也是全局變量聲明的地方。如下是 app.js 中的一段代碼:


        上述代碼中的一些 API 介紹:

        App : 注冊一個小程序

        onLunch :程序加載時執行的方法

        getStorageSync:以同步的方式獲取本地緩存

        setStorageSync:設置緩存

        wx.getUserInfo: 獲取用戶信息

        app.json 是對整個小程序的全局配置。不可注釋。

        pages為注冊頁面的列表,均為相對路徑,省去了后綴名,程序默認顯示列表第一個。

        微信小程序開發入門















        app.wxss 是整個小程序的公共樣式表。

        其中:

         apx 是尺寸單位,可根據屏幕寬度自適應大小。與之對應的有rem:規定屏幕寬度為20rem;1rem = (750/20)rpx 。


        全局文件就這些,然后我們看 index  文件中的內容

        有三部分內容,index.js ,index.wxml ,index.wxss,下面介紹它們的作用。


        index.wxml 文件

        這是一個展示頁面,作用于html相同?梢钥闯,內容分塊均采用 view 標簽,這也很容易讓人想到Android 中的布局,但其實只是更多的是 div 標簽的另一個版本,在這里面有很多 MINA 自定義的屬性,而且在我們在其中也看到了{{ }}樣式的值操作,這也很容易讓人聯想到 angularJS 中的數據雙向綁定,在 MINA 中也是支持的。

        同時,頁面的展示,均需要在小程序全局的json配置文件中配置,前面已有說明。

        微信小程序開發入門


        index.js 文件

        其中:

        getApp() 獲取應用實例

        Page : 聲明頁面。

        data: 定義數據

        bindViewTap :為在view中綁定的是tap事件定義操作方法。

        wx.navigateTo :導航到響應頁面。

        onLoad : 定義頁面加載時的事件。在這里使用了在全局 app.js 中定義的回調函數,將data中的數據更新,由于雙向的綁定,頁面中的 userInfo 實例也會更新,顯示出您的頭像和昵稱。

        微信小程序開發入門

        index.wxss 中同樣定義了一些樣式,寫法思路與css文件基本一致,只是不需要再去關心屏幕適配問題。


        隨后就是效果展示了,在開發者工具中掃碼即可查看效果。


        注意事項:

        • 這里只是入門實例,詳細內容可以將來會有詳細的API文檔。
        • 微信小程序處于內測階段,開發的詳情處于保密因素不會對外界透露,期待后期更新


        客服中心
        联系方式
        400-627-6877
        177-8068-6777
        - 總經理:李維
        掃一掃二維碼,加我微信
        技术支持: 源昇科技 | 管理登录
        亚洲综合制服丝袜另类,国产精品第一页,国产主播视频一区二区三区,青娱极品盛宴免费观看看
        <big id="haewi"></big>
      2. <span id="haewi"></span>
          <big id="haewi"></big>