• 組件列表
  • 視圖容器
  • 基礎(chǔ)內(nèi)容
  • 表單組件
  • 導(dǎo)航
  • 媒體組件
  • 地圖
  • 畫布
  • 開放能力
  • 內(nèi)容服務(wù)組件
  • 動(dòng)態(tài)庫組件

組件列表

智能小程序組件，是對(duì)數(shù)據(jù)和方法進(jìn)行封裝的小程序視圖控件，擁有自己的屬性和方法，可幫助開發(fā)者拼裝完成自己的智能小程序頁面。由于組件可能被轉(zhuǎn)譯為不同端對(duì)應(yīng)的代碼，所以在頁面創(chuàng)建過程中，禁止使用智能小程序組件標(biāo)簽以外的標(biāo)簽（例如：HTML 中 script/link/iframe 標(biāo)簽）。
本文匯總了智能小程序提供的所有組件，具體組件信息可參閱對(duì)應(yīng)文檔。

成都創(chuàng)新互聯(lián)是一家專業(yè)提供龍川企業(yè)網(wǎng)站建設(shè),專注與成都網(wǎng)站設(shè)計(jì)、成都網(wǎng)站建設(shè)、html5、小程序制作等業(yè)務(wù)。10年已為龍川眾多企業(yè)、政府機(jī)構(gòu)等服務(wù)。創(chuàng)新互聯(lián)專業(yè)網(wǎng)站設(shè)計(jì)公司優(yōu)惠進(jìn)行中。

視圖容器

組件名稱	解釋
cover-image	圖片視圖。覆蓋在原生組件之上可覆蓋的原生組件同 cover-view，支持嵌套在 cover-view 里
cover-view	文本視圖。覆蓋在原生組件之上，只支持嵌套 cover-view、cover-image 組件
movable-area	可移動(dòng)視圖區(qū)域。movable-view 的可移動(dòng)區(qū)域
movable-view	可移動(dòng)的視圖容器。在頁面中可以拖拽滑動(dòng)，movable-view 必須在 movable-area 組件中，并且必須是直接子節(jié)點(diǎn)，否則不能移動(dòng)
scroll-view	可滾動(dòng)視圖區(qū)域?？蓪?shí)現(xiàn)橫向滾動(dòng)和豎向滾動(dòng)。使用豎向滾動(dòng)時(shí)，需要給定一個(gè)固定高度，可以通過 css 來設(shè)置 height
swiper	滑塊視圖容器。內(nèi)部只允許使用組件描述滑塊內(nèi)容，否則會(huì)導(dǎo)致未定義的行為
swiper-item	滑塊視圖容器子項(xiàng)。僅可放置在組件中，寬高自動(dòng)設(shè)置為 100%
view	視圖容器。相當(dāng)于 html 中的 div ，可將頁面分割為獨(dú)立的、不同的部分。如果需要使用滾動(dòng)視圖，請(qǐng)使用 scroll-view

基礎(chǔ)內(nèi)容

組件名稱	解釋
icon	圖標(biāo)。放置圖標(biāo)的元素
progress	進(jìn)度條
rich-text	富文本。nodes 屬性推薦使用 Array 類型，由于組件會(huì)將 String 類型轉(zhuǎn)換為 Array 類型，因而性能會(huì)有所下降
text	文本。放置文本的元素

表單組件

組件名稱	解釋
button	按鈕
checkbox	多選項(xiàng)目
checkbox-group	多選項(xiàng)目組。內(nèi)部由多個(gè) checkbox 組成
form	表單。將 form 組件內(nèi)用戶輸入 / 選擇的、、、、、提交。當(dāng) 表單中 form-type 為 submit 時(shí)，點(diǎn)擊的組件會(huì)將表單組件中的 value 值進(jìn)行提交，需要在表單組件中加上 name 來作為 key
input	輸入框。v3.105.0 開始支持同層渲染
label	表單組件標(biāo)簽。用來改進(jìn)表單的可用性，使用 for 屬性找到對(duì)應(yīng)的 id（必須寫 for），當(dāng)點(diǎn)擊時(shí)，就會(huì)觸發(fā)對(duì)應(yīng)的控件
picker	底部彈起的滾動(dòng)選擇器
picker-view	可嵌頁面的滾動(dòng)選擇器
picker-view-column	可嵌頁面的滾動(dòng)選擇器子項(xiàng)。僅可放置于中，其孩子節(jié)點(diǎn)的高度會(huì)自動(dòng)設(shè)置成與 picker-view 的選中框的高度一致
radio	單選項(xiàng)目
radio-group	單選項(xiàng)目組。內(nèi)部由多個(gè) radio 組成
slider	滑動(dòng)選擇器
switch	開關(guān)選擇器
textarea	多行輸入框。v3.140.1 起支持同層渲染，內(nèi)部不支持嵌套其他組件

導(dǎo)航

組件名稱	解釋
navigator	頁面導(dǎo)航?？刂菩〕绦虻奶D(zhuǎn)，既可在當(dāng)前小程序內(nèi)部進(jìn)行跳轉(zhuǎn)，也可跳轉(zhuǎn)至其他小程序
tabs	標(biāo)簽欄。用于讓用戶在不同的視圖中進(jìn)行切換
tab-item	標(biāo)簽欄子項(xiàng)。配合 tabs 一起使用，展示標(biāo)簽欄欄內(nèi)單個(gè) tab 內(nèi)容

媒體組件

組件名稱	解釋
animation-video	為智能小程序提供了將特定視頻資源渲染為透明背景動(dòng)效的能力，可以幫助開發(fā)者低成本實(shí)現(xiàn)更為沉浸，豐富的動(dòng)畫效果
animation-view	Lottie 動(dòng)畫組件。客戶端創(chuàng)建的原生組件，使用時(shí)請(qǐng)注意相關(guān)限制
audio	音頻
camera	相機(jī)。使用該組件需通過獲取用戶授權(quán)設(shè)置申請(qǐng)授權(quán)后方可對(duì)用戶發(fā)起授權(quán)申請(qǐng)，可在 swan.authorize 中查看相關(guān)錯(cuò)誤碼信息
ar-camera	AR 相機(jī)。在 DuMixAR 內(nèi)容開放平臺(tái)提交并上線 AR 項(xiàng)目后（選擇“百度 App-相機(jī)”渠道）獲取到 AR Key、AR Type，可配置展現(xiàn)，基礎(chǔ)庫 3.15.104 開始支持
image	圖片。image 組件默認(rèn)寬度 300px、高度 225px
live-player	實(shí)時(shí)視頻播放器?？蛻舳藙?chuàng)建的原生組件，使用時(shí)請(qǐng)注意相關(guān)限制，v3.140.1 起支持同層渲染
video	視頻。v3.70.0 開始支持同層渲染
rtc-room	實(shí)時(shí)音視頻通話房間。v3.200.0 開始支持
rtc-room-item	實(shí)時(shí)音視頻通話畫面。v3.200.0 開始支持，默認(rèn)為同層渲染

地圖

組件名稱	解釋
map	地圖?？蛻舳藙?chuàng)建的原生組件，使用時(shí)請(qǐng)注意相關(guān)限制

畫布

組件名稱	解釋
canvas	畫布。一個(gè)矩形區(qū)域，開發(fā)者可以在頁面上繪制圖形。canvas 擁有多種繪制路徑、矩形、圖形、字符以及添加圖像的方法

開放能力

組件名稱	解釋
ad	廣告組件。按照流量主開通指引中的操作獲取廣告組件代碼
open-data	開放數(shù)據(jù)。用于展示百度 App 開放的數(shù)據(jù)
web-view	網(wǎng)頁容器。web-view 組件是一個(gè)可以用來承載網(wǎng)頁的容器，會(huì)自動(dòng)鋪滿整個(gè)智能小程序頁面

內(nèi)容服務(wù)組件

組件名稱	解釋
like	點(diǎn)贊。支持將用戶對(duì)文章/評(píng)論的點(diǎn)贊行為同步給百度后端，實(shí)現(xiàn)對(duì)點(diǎn)贊對(duì)象(若此對(duì)象的文章/評(píng)論是在小程序內(nèi)用評(píng)論組件生產(chǎn))的消息通知。需要將點(diǎn)贊對(duì)象的文章/評(píng)論內(nèi)容一起提交
follow-swan	關(guān)注小程序 button 組件可幫助開發(fā)者實(shí)現(xiàn)用戶對(duì)小程序的關(guān)注。用戶通過本組件“關(guān)注小程序”后，可以在“百度 APP” - “我的”中找到我的小程序
One-stop Interaction	一站式互動(dòng)組件。為開發(fā)者提供一整套包含評(píng)論發(fā)布器、評(píng)論列表及詳情、點(diǎn)贊、轉(zhuǎn)發(fā)功能的互動(dòng) bar 能力，此外還提供數(shù)據(jù)存儲(chǔ)、數(shù)據(jù)內(nèi)容審核、用戶接收百度 APP 消息通知的一站式組件服務(wù)
comment-list	一站式互動(dòng)組件的評(píng)論列表組件?？蓡为?dú)使用
comment-detail	一站式互動(dòng)組件的評(píng)論詳情組件。需與列表組件搭配使用

動(dòng)態(tài)庫組件

組件名稱	解釋
Editor 富文本編輯器	eidtor 動(dòng)態(tài)庫提供了在小程序中進(jìn)行富文本編輯的方法
swan-sitemap 小程序索引頁組件	swan-sitemap 動(dòng)態(tài)庫是百度小程序官方發(fā)布的用于生成小程序索引頁的動(dòng)態(tài)庫組件，開發(fā)者可以在小程序項(xiàng)目中引用 swan-sitemap 動(dòng)態(tài)庫，并通過 swan-sitemap-list 組件高效的開發(fā)出符合搜索收錄規(guī)范的小程序索引頁
ECharts 圖表-beta	ECharts 動(dòng)態(tài)庫是智能小程序基于 ECharts 實(shí)現(xiàn)的圖表動(dòng)態(tài)庫，提供了圖表在小程序中的使用方法。如果在使用中碰到問題，可以在 Github 提問
modelviewer VR 3D 模型-beta	modelviewer 動(dòng)態(tài)庫提供了在小程序中展示 3D 模型功能，底層基于百度 webVR SDK Hydreigon 實(shí)現(xiàn)
panoviewer VR 全景圖-beta	panoviewer 動(dòng)態(tài)庫提供了在小程序中播放全景圖的方法，底層基于百度 webVR SDK Hydreigon 實(shí)現(xiàn)
spintileviewer VR 3D 環(huán)物—beta	spintileviewer 動(dòng)態(tài)庫提供了在小程序中播放 3D 環(huán)物的方法，底層基于百度 webVR SDK Hydreigon 實(shí)現(xiàn)
vrvideo VR 全景-beta	vrvideo 動(dòng)態(tài)庫提供了在小程序中播放全景視頻的方法

本文名稱：創(chuàng)新互聯(lián)百度小程序教程：組件列表
地址分享：http://www.5511xx.com/article/cdegsoh.html