摘要:微信小程序一介紹微信小程序可以說是網頁的進階版,同樣的功能,它可以更加便利。微信小程序是需要下載的,但是微信審核要小程序代碼一下,所以這個下載相當于不用下載。
微信小程序(一) 介紹
微信小程序可以說是網頁的進階版,同樣的功能,它可以更加便利。微信小程序是需要下載的,但是微信審核要小程序代碼1M一下,所以這個下載相當于不用下載。
小程序官網地址
微信小程序對比軟件:
小巧輕便,無需下載那么繁重
一個版本,所有手機通用
但是沒有軟件功能那么多
微信小程序對比網頁:
更加好傳播
訪問時代碼在本地,跳轉其他頁面時加載無需再次從云端訪問,所以跟加快
小程序有許多系統自帶的空間,所以流暢度上是比網頁更加好的
對于用戶來說:
微信小程序更加便利,它小巧,功能強大,訪問快捷,微信審核是需要1M以下的,所以打開加載也非常的快,在微信上就可以使用其他軟件的功能無需下載多一個軟件切換使用
對于開發者來說:
一個版本就可以所有型號的手機都適配,無需再重新編譯個其他語言的版本。幾乎是把前端取其精華,去其糟粕。
環境編譯器
使用微信小程序需要在官網下載個微信小程序的編譯器,雖然也不一定要微信官方的,用vscode或HbuilderX也行,但是微信官方的對編譯和預覽方面比較方便。
官方下載地址
下載完之后直接安裝使用即可
開始小程序開始小程序需要一個小程序開發資格的賬號,去官網注冊一個即可小程序官網地址
注冊完之后將找到其中的AppID記錄一下,以后會用到
然后打開編譯器,使用注冊了微信小程序資格的微信賬號登陸就會出現初始頁面
選中小程序
如果只是學習的文件不需要上線的就可以使用測試AppID
資料填完以后會出現個初始化頁面,會出現預覽框,代碼框,和控制臺
代碼框的側邊欄有幾個文件pages,index,utils,logs,app.js,app.json,app.wxss,project.config.json,sitemap.json
? pages文件放的是所有文件,相當于根目錄,app.js是全局腳本文件,app.wxss是全局樣式文件,app.json是全局配置文件,里面包含一個pages屬性和window屬性,pages屬性是訪問路徑設置,window屬性是全局窗口配置,當然,優先級是本文件夾中的json文件為標準
index文件存放的是index.wxml,index.wxss,index.js,index.json,前三個文件相當于前端網頁的html文件,css文件,js文件,json文件存放的是index文件夾內的文件配置,看到名字index可以明顯知道這個是主頁面,但是不是像前端一樣把主頁面文件設置為index就是主頁面,而是在app.json的pages對象內排列順序,排第一位的就是主頁面
logs文件存放的是自帶寫好的啟動日志文件
注意:在json文件中不允許有注釋,并且對象最后一個屬性后面不能接逗號,在前端中對象最后一個是可以接逗號的,但小程序中不允許
快速創建一個文件右鍵pages文件夾,也就是根目錄,新建一個目錄
在新建的目錄中右鍵新建一個page,這時候輸入名字回車就會新建好所有配置文件,包含wxml,wxss,js,json文件
常用的語法詳情參考微信開發文檔
wx:for:循環,類似于vue中的v-for的作用,在小程序中,js文件也有個對象,里面有個data屬性,作用與vue的一樣,存放變量。在wx:for中,有兩個類似于形參一樣的東西,item,index,item就是代表循環對象的value,index就是循環對象的key。
例子:
注:在小程序中很多標簽做作用和h5的一樣,但做了語義化調整,像view就是div
wx:for-item/key:循環數組或對象時代表其值/下標的形參指定別名
例子:
wx:if:為標簽添加條件
例子: show:10,
wx:elif:此標簽與if配套使用,中間不可以有其他標簽,這個標簽就是else-if的縮寫,所以作用一目了然
wx:else:此標簽與if/elif配套使用,中間不可以有不是配套的標簽穿插其中,這個標簽作用很明顯就是else的作用
wx:key:如果列表中項目的位置會動態改變或者有新的項目添加到列表中,并且希望列表中的項目保持自己的特征和狀態(如 input 中的輸入內容,switch 的選中狀態),需要使用 wx:key 來指定列表中項目的唯一的標識符。
注意:如果不使用wx:key的話會有個警告,Now you can provide attr `wx:key` for a `wx:for` to improve performance.意思是如果使用wx:key可以提升性能。因為如果不使用wx:key的話列表是刪掉重新渲染,使用的話是保留狀態重新排序,在效率上加wx:key會有所提升。
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/105810.html
摘要:微信應用號小程序資源匯總。每天不定期整理和收集微信小程序相關資源,方便查閱和學習,歡迎大家提交新的資源,完善和補充。 wechat-weapp-resource 微信應用號(小程序)資源匯總。 每天不定期整理和收集微信小程序相關資源,方便查閱和學習,歡迎大家提交新的資源,完善和補充。 showImg(https://segmentfault.com/img/remote/1460000...
摘要:微信應用號小程序資源匯總。每天不定期整理和收集微信小程序相關資源,方便查閱和學習,歡迎大家提交新的資源,完善和補充。 wechat-weapp-resource 微信應用號(小程序)資源匯總。 每天不定期整理和收集微信小程序相關資源,方便查閱和學習,歡迎大家提交新的資源,完善和補充。 showImg(https://segmentfault.com/img/remote/1460000...
摘要:微信小程序應用號開發資源匯總文檔工具教程代碼插件組件文檔從搭建一個微信小程序開始小程序開發文檔小程序設計指南工具小程序開發者工具官方支持微信小程序實時預覽的支持的微信小程序組件化開發框架轉在線工具小程序云端增強社區微信小程序 微信(小程序or應用號)開發資源匯總-文檔-工具-教程-代碼-插件-組件 文檔 從搭建一個微信小程序開始 小程序開發文檔 小程序設計指南 工具 小程序開發者...
閱讀 2348·2021-11-15 11:37
閱讀 2625·2021-09-23 11:21
閱讀 2951·2021-09-07 10:11
閱讀 3164·2019-08-30 15:53
閱讀 2826·2019-08-29 15:13
閱讀 1606·2019-08-26 13:57
閱讀 1098·2019-08-26 12:23
閱讀 2438·2019-08-26 11:51