建站
咨詢
售后
建站咨詢
新聞中心
- anchor-img 標(biāo)簽圖片
- 屬性說明
- list 標(biāo)簽數(shù)組有效值
- 示例
- 代碼示例
- 代碼示例
- 屬性說明
anchor-img 標(biāo)簽圖片
解釋：標(biāo)簽圖片組件，控制展開顯示標(biāo)簽以及點(diǎn)擊標(biāo)簽獲取當(dāng)前標(biāo)簽信息。可支持 aspectFit 和 widthFix 兩種圖片模式，支持自動(dòng)計(jì)算標(biāo)簽方向，支持更改標(biāo)簽顏色和風(fēng)格。
成都創(chuàng)新互聯(lián)10多年成都企業(yè)網(wǎng)站建設(shè)服務(wù);為您提供網(wǎng)站建設(shè),網(wǎng)站制作,網(wǎng)頁設(shè)計(jì)及高端網(wǎng)站定制服務(wù),成都企業(yè)網(wǎng)站建設(shè)及推廣,對成都混凝土泵車等多個(gè)方面擁有豐富的網(wǎng)站制作經(jīng)驗(yàn)的網(wǎng)站建設(shè)公司。
屬性說明
| 屬性名 | 類型 | 必填 | 默認(rèn)值 | 說明 |
|---|---|---|---|---|
|
url |
String |
是 |
標(biāo)簽圖片地址 |
|
|
originWidth |
Number |
是 |
圖片原始寬度 |
|
|
originHeight |
Number |
是 |
圖片原始高度 |
|
|
list |
Array |
是 |
標(biāo)簽數(shù)組。例： |
|
|
mode |
String |
否 |
widthFix |
標(biāo)簽圖片模式。目前只支持 widthFix 和 aspectFit |
|
showAnchor |
Boolean |
否 |
true |
是否默認(rèn)展開標(biāo)簽 |
|
maxFontCount |
Number |
否 |
6 |
允許顯示的標(biāo)簽最大字?jǐn)?shù)，多余省略。position 為空時(shí)用于計(jì)算左右方向 |
|
textColor |
Color |
否 |
#fff |
標(biāo)簽文本顏色 |
|
tagColor |
Color |
否 |
rgba(0，0，0，0.6) |
標(biāo)簽背景色 |
|
fontSize |
Number |
否 |
12 |
標(biāo)簽字號大小 |
|
roundSize |
Number |
否 |
10 |
圓點(diǎn)直徑，與標(biāo)簽連線長度一致 |
|
needHandler |
Boolean |
否 |
true |
是否需要控制器 |
|
handlerSize |
Number |
否 |
15 |
控制器圖標(biāo)寬 / 高 |
|
active |
EventHandle |
否 |
點(diǎn)擊某個(gè)標(biāo)簽觸發(fā) |
list 標(biāo)簽數(shù)組有效值
| 屬性名 | 類型 | 必填 | 默認(rèn)值 | 說明 |
|---|---|---|---|---|
| type | String | 否 | default | 標(biāo)簽的風(fēng)格類型，默認(rèn)為不帶商品圖標(biāo)，值為 primary 時(shí)帶商品圖標(biāo) |
| abscissa | Number | 是 | 0 | 標(biāo)簽相對于原圖的位置橫坐標(biāo) |
| ordinate | Number | 是 | 0 | 標(biāo)簽相對于原圖的位置縱坐標(biāo) |
| position | String | 否 | 標(biāo)簽相對于圓點(diǎn)的方向。left：朝左；right：朝右。不傳會根據(jù) maxFontSize 及 fontSize 計(jì)算 | |
| text | String | 是 | 標(biāo)簽文本 |
示例
跳轉(zhuǎn)編輯工具
在開發(fā)者工具中打開
在 WEB IDE 中打開
掃碼體驗(yàn)
代碼示例
請使用百度APP掃碼
代碼示例
- SWAN
- JS
- JSON
mode="widthFix"url="{{img}}"origin-width="{{originWidth}}"origin-height="{{originHeight}}"max-font-count="6"list="{{list}}"bind:active="activeAnchorImg">
分享題目：創(chuàng)新互聯(lián)百度小程序教程：anchor-img標(biāo)簽圖片
分享鏈接：http://fisionsoft.com.cn/article/cdepisc.html
