创新互联百度小程序教程：anchor-img标签图片

  • anchor-img 标签图片
    • 属性说明
      • list 标签数组有效值
    • 示例
      • 代码示例

    anchor-img 标签图片

    解释：标签图片组件，控制展开显示标签以及点击标签获取当前标签信息。可支持 aspectFit 和 widthFix 两种图片模式，支持自动计算标签方向，支持更改标签颜色和风格。

    成都创新互联10多年成都企业网站建设服务;为您提供网站建设,网站制作,网页设计及高端网站定制服务,成都企业网站建设及推广,对成都混凝土泵车等多个方面拥有丰富的网站制作经验的网站建设公司。

    属性说明

    属性名 类型 必填 默认值 说明

    url

    String

    是

    标签图片地址

    originWidth

    Number

    是

    图片原始宽度

    originHeight

    Number

    是

    图片原始高度

    list

    Array

    是

    标签数组。例：[{type: ‘default’,ordinate: 100,abscissa: 200, position: ‘left’,text: ‘测试’}]

    mode

    String

    否

    widthFix

    标签图片模式。目前只支持 widthFix 和 aspectFit

    showAnchor

    Boolean

    否

    true

    是否默认展开标签

    maxFontCount

    Number

    否

    6

    允许显示的标签最大字数，多余省略。position 为空时用于计算左右方向

    textColor

    Color

    否

    #fff

    标签文本颜色

    tagColor

    Color

    否

    rgba(0，0，0，0.6)

    标签背景色

    fontSize

    Number

    否

    12

    标签字号大小

    roundSize

    Number

    否

    10

    圆点直径，与标签连线长度一致

    needHandler

    Boolean

    否

    true

    是否需要控制器

    handlerSize

    Number

    否

    15

    控制器图标宽 / 高

    active

    EventHandle

    否

    点击某个标签触发

    list 标签数组有效值

    属性名 类型 必填 默认值 说明
    type String 否 default 标签的风格类型，默认为不带商品图标，值为 primary 时带商品图标
    abscissa Number 是 0 标签相对于原图的位置横坐标
    ordinate Number 是 0 标签相对于原图的位置纵坐标
    position String 否 标签相对于圆点的方向。left：朝左；right：朝右。不传会根据 maxFontSize 及 fontSize 计算
    text String 是 标签文本

    示例

    跳转编辑工具

    在开发者工具中打开

    在 WEB IDE 中打开

    扫码体验

    代码示例

    请使用百度APP扫码

    代码示例

    • SWAN
    • JS
    • JSON
     
 
 
      
  
  
  
      2.   
  
  
    2.  
      3.   
  
  
    3.  mode="widthFix"
      4.   
  
  
    4.  url="{{img}}"
      5.   
  
  
    5.  origin-width="{{originWidth}}"
      6.   
  
  
    6.  origin-height="{{originHeight}}"
      7.   
  
  
    7.  max-font-count="6"
      8.   
  
  
    8.  list="{{list}}"
      9.   
  
  
    9.  bind:active="activeAnchorImg"
      10.   
  
  
    10.  >
      11.   
  
  
      12.

    网站栏目：创新互联百度小程序教程：anchor-img标签图片
    分享地址：http://www.shufengxianlan.com/qtweb/news30/51480.html

    网站建设、网络推广公司-创新互联，是专注品牌与效果的网站制作，网络营销seo公司；服务项目有等

    广告

    声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源： 创新互联

    猜你还喜欢下面的内容

    动态网站知识

    同城分类信息

    网页设计制作　　 　内江广告　　 　芦山网站建设　　 　东电技服　　 　网站建设　　 　成都网站优化　　 　成都移动主机托管　　 　成都广告设计公司　　 　钢筋机械设备　　 　网站建设改版　　 　雕琢时光茶叶　　 　平城网站运维　　 　网站seo优化　　 　教育建设方案　　 　橡塑板　　 　网站域名　　 　虚拟主机　　 　网站推广公司　　 　精灵网　　 　马边网站建设