网站seo优化_亚洲九色_seo云优化_亚洲九九九_搜索引擎seo_亚洲九九精品_启新网络服务中心

企億推信息網
專注網絡推廣服務

微信小程序開發-深圳微信開發-沙漠風網站建設公司

  想開發小程序,就得先學會一套微信特制的「開發語言」。

  為了讓大家上手這門開發語言,微信官方提供了一份十分詳細的開發文檔:

  要是沒時間通讀,這里還有一份省時省力的替代品:

  知曉程序(微信號zxcx0101)準備了一份官方開發文檔的超簡濃縮版,不僅囊括了官方文檔的所有重點信息,而且篇幅只有原文的三分之一。

  只要看完這篇文章,你就能快速上手小程序開發。

  注:本文適宜有一定編程基礎的人閱讀。要想零基礎學習小程序開發,請繼續關注知曉程序(微信號zxcx0101)的后續內容。

  語言與文件

  各位可能已經知道,微信小程序開發與其他平臺的開發大差異在于:微信使用的開發語言和文件很「特殊」。

  小程序所使用的程序文件類型大致分為以下幾種:

  WXML(WeiXinMarkLanguage,微信標記語言)

  WXSS(WeiXinStyleSheet,微信樣式表)

  JS(JavaScript,小程序的主體)

  在語言方面,看上去小程序幾乎重新定義了一套標準。但是實際上,它們與「前端三件套」——HTML、CSS和JavaScript——差不太多。

  下面,我們就來對比一下小程序開發語言和「前端三件套」有什么異同點:

  HTML與WXML:兩者差異比較大,如果之前沒有接觸過Android開發,可能會覺得有些頭疼。事實上,WXML更像是Android開發中的界面XML描述文件,更適合于程序界面的構建;而HTML則傾向于文章的展示(這與HTML的歷史有關),以及互聯網頁面的構建。

  WXSS與CSS:兩者在語言上幾乎沒有差別,可以直接通用。

微信小程序開發-深圳微信開發-沙漠風網站建設公司

(圖1)

  JS文件:小程序的JS文件與前端開發使用的JS幾乎沒有區別,小程序的JS新增了微信的一些API接口,并去除了一些不必要的功能(如DOM)。

  在語言上,小程序完全向學習成本低的前端開發看齊,但這不代表所有前端開發者都能直接無縫遷移。

  如果你是從前端開發轉向小程序,就需要注意這兩個點:

  HTML與WXML兩種文件的構建思想差異較大,如果之前只接觸過前端開發,需要一點時間才能適應WXML的編寫方法。

  雖然小程序使用的是前端語言,但不代表可以繼續沿用前端的開發思想進行開發(類似前端向Node.js發展)。小程序對前端開發的要求從「構建界面」升級成「開發完整應用」,前端開發依然需要在意識上進行轉變。

  界面構建

  基本邏輯

  WXML和WXSS兩種文件是小程序界面元素聲明及樣式描述文件。WXML大的特點是以視圖(view)的方式串聯界面元素,并通過程序邏輯(AppService),將信息更新實時傳遞至視圖層。

  view類似于HTML中的div元素。在構建的時候,view可以被多級嵌套,view內可以放置任意視覺元素。

  需要注意的是,元素一旦超出屏幕之外,用戶是無法再看到的,這與HTML有較大不同。舉一個例子,將手機屏幕想像成一個舞臺,在舞臺之外的演員是無法被觀眾看到的。

  小程序有專門用于滾動的視圖,如果希望界面是一個可以自由滾動的界面(例如列表等),可以使用scroll-view視圖,在WXSS中將其大小調整為整個屏幕,并設置scroll-y(上下滾動)或scroll-x(左右滾動)為true。

  小程序中不能直接使用DOM控制WXML元素。如果需要進行數據更新,需要使用WXML提供的數據綁定及元素渲染方法。

  還有一點需要注意的是:小程序的柵格排版系統使用的是Flex布局,它是W3C在2009年提出的一種排版標準。

  綁定數據

  對于單個字段,開發者可以使用數據綁定的方法進行信息更新。綁定的數據除了在加載的時候可以更新,也可以在JS主程序中以函數形式進行更新,更新同樣可以反映到界面上被綁定的數據中。

  條件渲染與列表(循環)渲染

  條件渲染適合帶有意外情況提示的頁面(如無法加載列表或詳情時做出提示等等)。它的渲染帶有觸發條件,即符合條件時渲染這個頁面,否則忽略或渲染另一段代碼。

  兩個花括號所包含的判斷條件中的變量于主程序JS代碼中的data中聲明。

  若需要在界面中構建一個列表,可以使用WXML中的循環渲染,將同一元素渲染代碼進行集合。循環的數據可以通過數組的方式寫入data中供WXML訪問。

  渲染完畢后,渲染判斷條件的變動可以影響界面變動。

  模板與引用

  WXML支持使用模板與引用減少代碼體積。

  模板是在WXML代碼中對相同的代碼進行復用的方式。

  可以將多個模板寫入至同一文件,并使用import在其他文件中進行引用。

  如果需要整個頁面引用,需要使用到include。

  樣式

  通過WXSS樣式表,開發者可以定義WXML中的元素樣式。WXSS與CSS代碼一樣,可以直接使用選擇器選擇元素。在WXML中也可以直接定義元素的id和class以便于在WXSS文件中進行樣式定義。

  用戶操作與事件響應

  由于微信使用的不是HTML,所以也不能通過添加超鏈接(a元素)的方式來監測用戶的點擊事件。對于需要監聽點擊事件的元素,應該在WXML中使用bindtap屬性或catchtap屬性進行綁定。

  除了點擊一次,微信也提供按住、開始觸摸、松手等事件響應。

  在WXML中綁定好一個事件之后,就能在主程序JS中使用。

  其他API中也有其他相應的事件,這些事件可以在微信小程序的官方文檔中查閱到。

  當需要在小程序的頁面間進行跳轉時,應該使用wx.navigateTo()方式。

  需要注意的是,有關于頁面層級跳轉,微信將層級跳轉限制到了五層。在開發時需要注意是否超過了相應限制。

  網絡訪問

  小程序支持三種請求方式。一種是直接的HTTP連接請求,請求后直接返回結果,連接結束。另一種是Socket持續性連接,當一方主動關閉連接時,連接結束。

  除了以上兩種收發純文本的連接方式,微信還提供了一個文件收發接口。小程序中錄制的語音以及選擇的照片都需要這個方式來進行上傳。

  通過小程序訪問網絡需要服務器端必須支持HTTPS安全連接,且端口號必須為443。同時,小程序只能訪問開發者在登記小程序時所設定的服務器地址。

  多媒體與存儲

  若需在小程序中播放多媒體(包括音視頻)或進行數據存儲,不能使用HTML5中所提供的標準,必須使用微信提供的小程序多媒體播放控制接口及存儲接口等。

  有關于聲音的接口有音頻播放與音樂播放兩種接口。音頻播放提供了播放、暫停和停止播放三種接口,不提供跳轉至某個播放時間點的功能,也不能獲取目前的播放進度。音樂播放接口提供除以上的基礎播放控制外的音樂狀態檢查和監聽等功能。

  小程序提供照片和視頻數據交換接口。通過這個接口,小程序可以訪問用戶選定或拍攝的照片與視頻。

  通過音頻錄制和視頻照片接口獲得的多媒體信息是臨時的,需要通過小程序存儲文件接口對文件進行永久保存。

  對于文本數據,小程序也提供了存儲這類數據的接口。從諸如Android或其他app平臺轉向的開發者需要注意的是,小程序不提供數據庫式的本地數據保存形式,而是通過「字段–值」的一對一形式進行保存。

  硬件相關

  小程序依托于微信,提供許多與硬件有關的API。以下數據,小程序可以通過API獲取到。

  系統相關信息(包括網絡狀態、設備型號、窗口尺寸等)

  重力感應數據

  羅盤數據

  通過以上API,應該可以輕松寫出「搖一搖」等互動性頁面。但需要注意:由于這些數據只能主動獲取,而不能通過這些數值變化的回調實時獲取。

  推送服務

  小程序提供有推送服務,可以隨時向用戶發送必要的通知。但請注意,推送服務只能用于通知提醒,不能用于群發。

  小程序中,推送服務叫做「模板消息」(之前有開發過服務號的開發者應該比較熟悉)。開發者需要在微信小程序后臺登記新的模板推送消息(比如:購買成功通知等)并審核通過后,才能在小程序中使用模板消息推送服務,具體審核標準建議參考相應文檔。

  模板消息審核通過后,開發者需要先向微信服務器獲取AccessToken,隨后將該值、模板編號和模板中的動態變量(比如:訂單號、價格等)提交給微信,由微信向用戶推送通知。

  用戶信息與微信支付

  小程序可以在用戶同意的前提下獲取到用戶的信息。小程序先要通過微信登錄的接口,讓用戶授權登錄。之后,小程序就可以展示并使用用戶信息。使用微信登錄的時候需要注意,消息需要經過簽名確認其完整性之后,方能保證數據未經篡改。

  小程序中也可以使用微信支付。需要注意的是在發送支付請求時,需要在發送的消息中添加簽名,以確認消息完整性。

  以上便是知曉程序為大家整理的官方開發文檔「重點信息」。

  不過,想要熟悉小程序,光看是不行的,還需要動手去做。

  如果開發過程中遇到問題,知名的辦法還是查閱微信官方的小程序開發文檔,相信在文檔中,你能找到絕大部分問題的解決辦法。

未經允許不得轉載:啟新網站SEO優化 » 微信小程序開發-深圳微信開發-沙漠風網站建設公司
分享到: 更多 (0)
加載中~
主站蜘蛛池模板: 全自动烧卖机厂家_饺子机_烧麦机价格_小笼汤包机_宁波江北阜欣食品机械有限公司 | 除甲醛公司-甲醛检测治理-杭州创绿家环保科技有限公司-室内空气净化十大品牌 | EDLC超级法拉电容器_LIC锂离子超级电容_超级电容模组_软包单体电容电池_轴向薄膜电力电容器_深圳佳名兴电容有限公司_JMX专注中高端品牌电容生产厂家 | 小程序开发公司-小程序制作-微信小程序开发-小程序定制-咏熠软件 | 东莞韩创-专业绝缘骨架|马达塑胶零件|塑胶电机配件|塑封电机骨架厂家 | 洛阳防爆合格证办理-洛阳防爆认证机构-洛阳申请国家防爆合格证-洛阳本安防爆认证代办-洛阳沪南抚防爆电气技术服务有限公司 | 送料机_高速冲床送料机_NC伺服滚轮送料机厂家-东莞市久谐自动化设备有限公司 | 消防泵-XBD单级卧式/立式消防泵-上海塑泉泵阀(集团)有限公司 | 直线模组_滚珠丝杆滑台_模组滑台厂家_万里疆科技 | 德州万泰装饰 - 万泰装饰装修设计软装家居馆 | 硅胶管挤出机厂家_硅胶挤出机生产线_硅胶条挤出机_臣泽智能装备 贵州科比特-防雷公司厂家提供贵州防雷工程,防雷检测,防雷接地,防雷设备价格,防雷产品报价服务-贵州防雷检测公司 | 微波消解仪器_智能微波消解仪报价_高压微波消解仪厂家_那艾 | 影像测量仪_三坐标测量机_一键式二次元_全自动影像测量仪-广东妙机精密科技股份有限公司 | 深圳善跑体育产业集团有限公司_塑胶跑道_人造草坪_运动木地板 | 深圳宣传片制作_产品视频制作_深圳3D动画制作公司_深圳短视频拍摄-深圳市西典映画传媒有限公司 | 门禁卡_智能IC卡_滴胶卡制作_硅胶腕带-卡立方rfid定制厂家 | 2025黄道吉日查询、吉时查询、老黄历查询平台- 黄道吉日查询网 | nalgene洗瓶,nalgene量筒,nalgene窄口瓶,nalgene放水口大瓶,浙江省nalgene代理-杭州雷琪实验器材有限公司 | 常州企业采购平台_常州MRO采购公司_常州米孚机电设备有限公司 | 搪玻璃冷凝器_厂家-越宏化工设备 | 深圳市人通智能科技有限公司| 葡萄酒灌装机-食用油灌装机-液体肥灌装设备厂家_青州惠联灌装机械 | 深圳市万色印象美业有限公司| 蓝鹏测控平台 - 智慧车间系统 - 车间生产数据采集与分析系统 | 英语词典_成语词典_日语词典_法语词典_在线词典网 | 防渗土工膜|污水处理防渗膜|垃圾填埋场防渗膜-泰安佳路通工程材料有限公司 | ★济南领跃标识制作公司★济南标识制作,标牌制作,山东标识制作,济南标牌厂 | 硬质合金模具_硬质合金非标定制_硬面加工「生产厂家」-西迪技术股份有限公司 | 电动卫生级调节阀,电动防爆球阀,电动软密封蝶阀,气动高压球阀,气动对夹蝶阀,气动V型调节球阀-上海川沪阀门有限公司 | 碳钢法兰厂家,非标法兰,定制异型,法兰生产厂家-河北九瑞管道 | 影像测量仪_三坐标测量机_一键式二次元_全自动影像测量仪-广东妙机精密科技股份有限公司 | 塑胶地板-商用PVC地板-pvc地板革-安耐宝pvc塑胶地板厂家 | 胜为光纤光缆_光纤跳线_单模尾纤_光纤收发器_ODF光纤配线架厂家直销_北京睿创胜为科技有限公司 - 北京睿创胜为科技有限公司 | 微水泥_硅藻泥_艺术涂料_艺术漆_艺术漆加盟-青岛泥之韵环保壁材 武汉EPS线条_EPS装饰线条_EPS构件_湖北博欧EPS线条厂家 | 镀锌角钢_槽钢_扁钢_圆钢_方矩管厂家_镀锌花纹板-海邦钢铁(天津)有限公司 | 小型气象站_车载气象站_便携气象站-山东风途物联网 | 拉力机-万能试验机-材料拉伸试验机-电子拉力机-拉力试验机厂家-冲击试验机-苏州皖仪实验仪器有限公司 | 镀锌钢格栅_热镀锌格栅板_钢格栅板_热镀锌钢格板-安平县昊泽丝网制品有限公司 | 广东高华家具-公寓床|学生宿舍双层铁床厂家【质保十年】 | 涿州网站建设_网站设计_网站制作_做网站_固安良言多米网络公司 | 岛津二手液相色谱仪,岛津10A液相,安捷伦二手液相,安捷伦1100液相-杭州森尼欧科学仪器有限公司 |