创新互联百度小程序教程：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.csdahua.cn/qtweb/news30/51480.html

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

    广告

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

    成都快上网为您推荐相关内容

    企业建站知识

    行业网站建设

    诚信建站　　 　四川电信机房托管　　 　成都外贸网站建设公司　　 　电信成都枢纽中心　　 　眉山服务器托管　　 　微信公众号开发　　 　响应式建站　　 　雕琢时光食品　　 　成都网络推广　　 　温江网站建设　　 　网络推广公司　　 　雕琢时光　　 　消防工程　　 　成都楼顶广告牌　　 　腾讯云香港虚拟主机　　 　深圳惠宜防蚊纱窗　　 　泽君科技　　 　成都app开发　　 　网络营销推广　　 　研学实践