2022-06-16 分類: 網(wǎng)站建設(shè)
微信小程序在哪開發(fā)?下面就和創(chuàng)新互聯(lián)的小編一起去看看吧。
當(dāng)你準(zhǔn)備開發(fā)一個微信小程序的時候,你首先需要一個小程序的APPId,在微信公眾號官網(wǎng)可以獲得。(暫時只有官方邀請的才可以獲得)。
你還需要準(zhǔn)備微信開發(fā)者工具,官網(wǎng)同樣有下載,下載安裝即可,支持windows,linux,和MAC平臺。
小程序使用的微信自己開發(fā)MINA框架,提供了視圖層描述語言,WXML和WXSS以及基于JavaScript的邏輯層框架,并在視圖層與邏輯層間提供了數(shù)據(jù)傳輸和事件系統(tǒng),可以讓開發(fā)者可以方便的聚焦于數(shù)據(jù)與邏輯上。
打開的時候會自動提示創(chuàng)建一個微信小程序demo,demo結(jié)構(gòu)文件樹如下:
其中app.js、app.json、app.wxss是必不可少的,是小程序生成的依賴文件。
app.js監(jiān)聽并控制這整個程序的生命周期,也是全局變量聲明的地方。如下是app.js中的一段代碼:
上述代碼中的一些API介紹:
App:注冊一個小程序
onLunch:程序加載時執(zhí)行的方法
getStorageSync:以同步的方式獲取本地緩存
setStorageSync:設(shè)置緩存
wx.getUserInfo:獲取用戶信息
app.json是對整個小程序的全局配置。不可注釋。
pages為注冊頁面的列表,均為相對路徑,省去了后綴名,程序默認(rèn)顯示列表第一個。
app.wxss是整個小程序的公共樣式表。
其中:
apx是尺寸單位,可根據(jù)屏幕寬度自適應(yīng)大小。與之對應(yīng)的有rem:規(guī)定屏幕寬度為20rem;1rem=(750/20)rpx。
全局文件就這些,然后我們看index文件中的內(nèi)容
有三部分內(nèi)容,index.js,index.wxml,index.wxss,下面介紹它們的作用。
index.wxml文件
這是一個展示頁面,作用于html相同。可以看出,內(nèi)容分塊均采用view標(biāo)簽,這也很容易讓人想到Android中的布局,但其實只是更多的是div標(biāo)簽的另一個版本,在這里面有很多MINA自定義的屬性,而且在我們在其中也看到了{{}}樣式的值操作,這也很容易讓人聯(lián)想到angularJS中的數(shù)據(jù)雙向綁定,在MINA中也是支持的。
同時,頁面的展示,均需要在小程序全局的json配置文件中配置,前面已有說明。
index.js文件
其中:
getApp( )獲取應(yīng)用實例
Page:聲明頁面。
data:定義數(shù)據(jù)
bindViewTap:為在view中綁定的是tap事件定義操作方法。
wx.navigateTo:導(dǎo)航到響應(yīng)頁面。
onLoad:定義頁面加載時的事件。在這里使用了在全局app.js中定義的回調(diào)函數(shù),將data中的數(shù)據(jù)更新,由于雙向的綁定,頁面中的userInfo實例也會更新,顯示出您的頭像和昵稱
index.wxss中同樣定義了一些樣式,寫法思路與css文件基本一致,只是不需要再去關(guān)心屏幕適配問題。
隨后就是效果展示了,在開發(fā)者工具中掃碼即可查看效果。
本文名稱:微信小程序在哪開發(fā)?
文章源于:http://www.rwnh.cn/news18/168118.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供云服務(wù)器、網(wǎng)站建設(shè)、網(wǎng)站營銷、面包屑導(dǎo)航、動態(tài)網(wǎng)站、關(guān)鍵詞優(yōu)化
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容