成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

微信小程序（一）

Imfan / 593人閱讀

摘要：微信小程序一介紹微信小程序可以說(shuō)是網(wǎng)頁(yè)的進(jìn)階版，同樣的功能，它可以更加便利。微信小程序是需要下載的，但是微信審核要小程序代碼一下，所以這個(gè)下載相當(dāng)于不用下載。

微信小程序（一） 介紹

微信小程序可以說(shuō)是網(wǎng)頁(yè)的進(jìn)階版，同樣的功能，它可以更加便利。微信小程序是需要下載的，但是微信審核要小程序代碼1M一下，所以這個(gè)下載相當(dāng)于不用下載。

小程序官網(wǎng)地址

微信小程序?qū)Ρ溶浖?/p>

小巧輕便，無(wú)需下載那么繁重

一個(gè)版本，所有手機(jī)通用

但是沒(méi)有軟件功能那么多

微信小程序?qū)Ρ染W(wǎng)頁(yè)：

更加好傳播

訪問(wèn)時(shí)代碼在本地，跳轉(zhuǎn)其他頁(yè)面時(shí)加載無(wú)需再次從云端訪問(wèn)，所以跟加快

小程序有許多系統(tǒng)自帶的空間，所以流暢度上是比網(wǎng)頁(yè)更加好的

對(duì)于用戶來(lái)說(shuō)：

微信小程序更加便利，它小巧，功能強(qiáng)大，訪問(wèn)快捷，微信審核是需要1M以下的，所以打開(kāi)加載也非常的快，在微信上就可以使用其他軟件的功能無(wú)需下載多一個(gè)軟件切換使用

對(duì)于開(kāi)發(fā)者來(lái)說(shuō)：

一個(gè)版本就可以所有型號(hào)的手機(jī)都適配，無(wú)需再重新編譯個(gè)其他語(yǔ)言的版本。幾乎是把前端取其精華，去其糟粕。

環(huán)境

編譯器

使用微信小程序需要在官網(wǎng)下載個(gè)微信小程序的編譯器，雖然也不一定要微信官方的，用vscode或HbuilderX也行，但是微信官方的對(duì)編譯和預(yù)覽方面比較方便。

官方下載地址

下載完之后直接安裝使用即可

開(kāi)始小程序

開(kāi)始小程序需要一個(gè)小程序開(kāi)發(fā)資格的賬號(hào)，去官網(wǎng)注冊(cè)一個(gè)即可小程序官網(wǎng)地址

注冊(cè)完之后將找到其中的AppID記錄一下，以后會(huì)用到

然后打開(kāi)編譯器，使用注冊(cè)了微信小程序資格的微信賬號(hào)登陸就會(huì)出現(xiàn)初始頁(yè)面

選中小程序

如果只是學(xué)習(xí)的文件不需要上線的就可以使用測(cè)試AppID

資料填完以后會(huì)出現(xiàn)個(gè)初始化頁(yè)面，會(huì)出現(xiàn)預(yù)覽框，代碼框，和控制臺(tái)

代碼框的側(cè)邊欄有幾個(gè)文件pages,index,utils,logs,app.js,app.json,app.wxss,project.config.json,sitemap.json

? pages文件放的是所有文件，相當(dāng)于根目錄，app.js是全局腳本文件，app.wxss是全局樣式文件，app.json是全局配置文件，里面包含一個(gè)pages屬性和window屬性，pages屬性是訪問(wèn)路徑設(shè)置，window屬性是全局窗口配置，當(dāng)然，優(yōu)先級(jí)是本文件夾中的json文件為標(biāo)準(zhǔn)

index文件存放的是index.wxml,index.wxss,index.js,index.json，前三個(gè)文件相當(dāng)于前端網(wǎng)頁(yè)的html文件，css文件，js文件，json文件存放的是index文件夾內(nèi)的文件配置，看到名字index可以明顯知道這個(gè)是主頁(yè)面，但是不是像前端一樣把主頁(yè)面文件設(shè)置為index就是主頁(yè)面，而是在app.json的pages對(duì)象內(nèi)排列順序，排第一位的就是主頁(yè)面

logs文件存放的是自帶寫好的啟動(dòng)日志文件

注意：在json文件中不允許有注釋，并且對(duì)象最后一個(gè)屬性后面不能接逗號(hào)，在前端中對(duì)象最后一個(gè)是可以接逗號(hào)的，但小程序中不允許

快速創(chuàng)建一個(gè)文件

右鍵pages文件夾，也就是根目錄，新建一個(gè)目錄

在新建的目錄中右鍵新建一個(gè)page，這時(shí)候輸入名字回車就會(huì)新建好所有配置文件，包含wxml,wxss,js,json文件

常用的語(yǔ)法

詳情參考微信開(kāi)發(fā)文檔

wx:for：循環(huán)，類似于vue中的v-for的作用，在小程序中，js文件也有個(gè)對(duì)象，里面有個(gè)data屬性，作用與vue的一樣，存放變量。在wx:for中，有兩個(gè)類似于形參一樣的東西，item,index，item就是代表循環(huán)對(duì)象的value，index就是循環(huán)對(duì)象的key。

例子：{{ item }}=>{{ index }}

注：在小程序中很多標(biāo)簽做作用和h5的一樣，但做了語(yǔ)義化調(diào)整，像view就是div

wx:for-item/key：循環(huán)數(shù)組或?qū)ο髸r(shí)代表其值/下標(biāo)的形參指定別名

例子：{{ value }}=>{{ key }}

wx:if：為標(biāo)簽添加條件

例子： show:10，數(shù)據(jù)是 {{ show }}

wx:elif:此標(biāo)簽與if配套使用，中間不可以有其他標(biāo)簽，這個(gè)標(biāo)簽就是else-if的縮寫，所以作用一目了然

wx:else:此標(biāo)簽與if/elif配套使用，中間不可以有不是配套的標(biāo)簽穿插其中，這個(gè)標(biāo)簽作用很明顯就是else的作用

wx:key：如果列表中項(xiàng)目的位置會(huì)動(dòng)態(tài)改變或者有新的項(xiàng)目添加到列表中，并且希望列表中的項(xiàng)目保持自己的特征和狀態(tài)（如 input 中的輸入內(nèi)容，switch 的選中狀態(tài)），需要使用 wx:key 來(lái)指定列表中項(xiàng)目的唯一的標(biāo)識(shí)符。

注意：如果不使用wx:key的話會(huì)有個(gè)警告，Now you can provide attr `wx:key` for a `wx:for` to improve performance.意思是如果使用wx:key可以提升性能。因?yàn)槿绻皇褂脀x:key的話列表是刪掉重新渲染，使用的話是保留狀態(tài)重新排序，在效率上加wx:key會(huì)有所提升。

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/105810.html

相關(guān)文章

  • 微信應(yīng)用號(hào)（小程序）資源匯總（1010更新）

    摘要：微信應(yīng)用號(hào)小程序資源匯總。每天不定期整理和收集微信小程序相關(guān)資源，方便查閱和學(xué)習(xí)，歡迎大家提交新的資源，完善和補(bǔ)充。 wechat-weapp-resource 微信應(yīng)用號(hào)（小程序）資源匯總。 每天不定期整理和收集微信小程序相關(guān)資源，方便查閱和學(xué)習(xí)，歡迎大家提交新的資源，完善和補(bǔ)充。 showImg(https://segmentfault.com/img/remote/1460000...

    趙春朋 評(píng)論0 收藏0

  • 微信應(yīng)用號(hào)（小程序）資源匯總（1010更新）

    摘要：微信應(yīng)用號(hào)小程序資源匯總。每天不定期整理和收集微信小程序相關(guān)資源，方便查閱和學(xué)習(xí)，歡迎大家提交新的資源，完善和補(bǔ)充。 wechat-weapp-resource 微信應(yīng)用號(hào)（小程序）資源匯總。 每天不定期整理和收集微信小程序相關(guān)資源，方便查閱和學(xué)習(xí)，歡迎大家提交新的資源，完善和補(bǔ)充。 showImg(https://segmentfault.com/img/remote/1460000...

    piapia 評(píng)論0 收藏0

  • 微信小程序資源匯總

    awesome-github-wechat-weapp 是由OpenDigg整理并維護(hù)的微信小程序開(kāi)源項(xiàng)目庫(kù)集合。我們會(huì)定期同步上的項(xiàng)目到這里，也歡迎各位 UI組件開(kāi)發(fā)框架實(shí)用庫(kù)開(kāi)發(fā)工具服務(wù)端項(xiàng)目實(shí)例Demo UI組件 weui-wxss ★1873 - 同微信原生視覺(jué)體驗(yàn)一致的基礎(chǔ)樣式庫(kù)zanui-weapp ★794 - 好用易擴(kuò)展的小程序 UI 庫(kù)wx-charts ★449 - 微信小程...

    Olivia 評(píng)論0 收藏0

  • 前端資源系列（3）-微信小程序開(kāi)發(fā)資源匯總

    摘要：微信小程序應(yīng)用號(hào)開(kāi)發(fā)資源匯總文檔工具教程代碼插件組件文檔從搭建一個(gè)微信小程序開(kāi)始小程序開(kāi)發(fā)文檔小程序設(shè)計(jì)指南工具小程序開(kāi)發(fā)者工具官方支持微信小程序?qū)崟r(shí)預(yù)覽的支持的微信小程序組件化開(kāi)發(fā)框架轉(zhuǎn)在線工具小程序云端增強(qiáng)社區(qū)微信小程序 微信(小程序or應(yīng)用號(hào))開(kāi)發(fā)資源匯總-文檔-工具-教程-代碼-插件-組件 文檔 從搭建一個(gè)微信小程序開(kāi)始 小程序開(kāi)發(fā)文檔 小程序設(shè)計(jì)指南 工具 小程序開(kāi)發(fā)者...

    paney129 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<