組件面板

此功能在 2.25.0 之后版本可用。
成都創(chuàng)新互聯(lián)自成立以來，一直致力于為企業(yè)提供從網(wǎng)站策劃、網(wǎng)站設(shè)計、成都網(wǎng)站建設(shè)、成都做網(wǎng)站、電子商務(wù)、網(wǎng)站推廣、網(wǎng)站優(yōu)化到為企業(yè)提供個性化軟件開發(fā)等基于互聯(lián)網(wǎng)的全面整合營銷服務(wù)。公司擁有豐富的網(wǎng)站建設(shè)和互聯(lián)網(wǎng)應(yīng)用系統(tǒng)開發(fā)管理經(jīng)驗、成熟的應(yīng)用系統(tǒng)解決方案、優(yōu)秀的網(wǎng)站開發(fā)工程師團隊及專業(yè)的網(wǎng)站設(shè)計師團隊。

為了方便開發(fā)者快速找到需要的組件，并快速查看組件的屬性、事件、樣式、demo、文檔等信息，開發(fā)者工具集成了組件面板。

組件面板可通過編輯器右上角按鈕打開。

打開面板后可看到基礎(chǔ)組件和擴展組件列表。

基礎(chǔ)組件

基礎(chǔ)組件為智能小程序框架提供的組件。組件列表。

在列表中選中組件后，下方會展示當(dāng)前組件的二維碼，文檔入口信息。用百度 APP 掃碼可查看當(dāng)前組件的 demo。

點擊查看文檔即可查看當(dāng)前組件的文檔。

組件代碼插入

在編輯器中打開 swan 文件，點擊插入按鈕，即可插入組件的代碼。插入代碼位置為編輯器中光標(biāo)所在位置，若光標(biāo)在組件的標(biāo)簽中，則會插入到光標(biāo)所在組件的內(nèi)部。如果光標(biāo)所在位置為自閉合組件，就在組件后插入代碼。

組件編輯

在編輯器中選中鼠標(biāo)選中組件后，可在組件面板下方直接編輯組件?？删庉嫷膬?nèi)容有屬性，事件，樣式。在編輯面板中的修改會實時同步到編輯器中。

擴展組件

擴展組件為智能小程序官方提供的 smart-ui，是一套開發(fā)、設(shè)計風(fēng)格統(tǒng)一的智能小程序擴展組件庫，由百度智能小程序官方設(shè)計團隊和智能小程序團隊為小程序量身設(shè)計，以增強開發(fā)者開發(fā)體驗。

組件通過 npm 管理，包名為 @smt-ui/component

擴展組件使用 npm 管理依賴，需要系統(tǒng)中裝有 Node.js 環(huán)境。并將編譯模式選擇為 依賴分析

首次插入擴展組件時，開發(fā)者工具會自動為小程序創(chuàng)建 package.json 文件，添加并安裝 @smt-ui/component 依賴。如果當(dāng)前環(huán)境變量中無 npm 命令，則會安裝組件庫失敗。

圖標(biāo)組件

開發(fā)者工具為擴展組件 smt-icon 提供了可視化編輯面板。方便用戶直接選擇圖標(biāo)。如果你在小程序官方示例中看到了圖標(biāo)，想使用又不知道圖標(biāo)的名字，來這里找就可以了。

文章標(biāo)題：創(chuàng)新互聯(lián)百度小程序教程：組件面板
本文路徑：http://m.fisionsoft.com.cn/article/dhpdhpp.html