甜橘子，专注成都网站制作网站设计与营销型网站建设与优化

QQ :532337155
电话：028-86922220
 
成都网站建设设计

将想法与焦点和您一起共享

创新互联百度小程序教程：checkbox-group多选

  • checkbox-group 多选
    • 属性说明
    • 示例
      • 代码示例

    checkbox-group 多选

    解释：多项选择组件，为开发者提供多项选择功能。

    我们提供的服务有：成都网站设计、做网站、微信公众号开发、网站优化、网站认证、砀山ssl等。为上千家企事业单位解决了网站和推广的问题。提供周到的售前咨询和贴心的售后服务，是有科学管理、有技术的砀山网站制作公司

    属性说明

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

    value

    Array

    否

    []

    已选的值

    disabled

    Boolean

    否

    false

    是否禁止点击

    column

    Number

    否

    1

    组件按照几列展示

    options

    Array

    是

    组件内容数组，如：
    [{
      name: ‘两字’,
      value: ‘1’,
      desc: ‘描述’
    }]，
    其中 name 为展示文案， value 为对应的值， desc 为描述文案

    options-key

    String

    否

    name

    options 数组中的 key， 如 name

    itemStyle

    Object

    否

    {}

    组件每一项的内联样式，如：
    { color: ‘#2772fb’}

    iconStyle

    Object

    否

    {}

    组件某一项选中时的 icon 样式，如：
    {
      color: ‘#2772fb’,
      name: ‘checked-l’
    }

    active-text-color

    String

    否

    #2772fb

    选中时的文字颜色

    active-icon-color

    String

    否

    #2772fb

    选中时的 icon 颜色

    active-bg-color

    String

    否

    rgba ( 39 , 114 , 251, .04 )

    选中时的背景颜色

    checkbox-group-class

    String

    否

    组件的外部样式类，可用于修改组件最外层样式

    bindchange

    EventHandle

    否

    点击组件每一项时触发，可用于获取已选择的 value 值

    示例

    跳转编辑工具

    在开发者工具中打开

    在 WEB IDE 中打开

    扫码体验

    代码示例

    请使用百度APP扫码

    代码示例

    • SWAN
    • JS
    • CSS
    • JSON
     
 
 
      
  
  
  
      2.   
  
  
      3.   
  
  
    3.  column="3"
      4.   
  
  
    4.  option-key="name"
      5.   
  
  
    5.  options="{{threeColumnOptions}}"
      6.   
  
  
    6.  value="{{[7]}}"
      7.   
  
  
    7.  bind:change="groupChange"
      8.   
  
  
    8. >
      9.   
  
  
      10.   
  
  
      11.   
  
  
      12.   
  
  
    12.  option-key="name"
      13.   
  
  
    13.  column="2"
      14.   
  
  
    14.  options="{{twoColumnOptions}}"
      15.   
  
  
    15.  value="{{[5]}}"
      16.   
  
  
    16.  bind:change="groupChange"
      17.   
  
  
    17. >
      18.   
  
  
      19.   
  
  
      20.   
  
  
      21.   
  
  
    21.  option-key="name"
      22.   
  
  
    22.  checkbox-group-class="checkbox-group"
      23.   
  
  
    23.  column="3"
      24.   
  
  
    24.  options="{{threeColumnDisabledOptions}}"
      25.   
  
  
    25.  value="{{[1]}}"
      26.   
  
  
    26.  bind:change="groupChange"
      27.   
  
  
    27. >
      28.   
  
  
      29.

    网站栏目：创新互联百度小程序教程：checkbox-group多选
    网站地址：https://chengdu.cdxwcx.cn/article/djeogop.html

    其他资讯