# 4.2 按钮组（Button Group）

按钮组组件，用于展示一组可选按钮

# 基础用法

<template>
  <dof-button-group :btn-group="btnGroup" @dofButtonGroupChange="onChange"></dof-button-group>
</template>

<script>
export default {
  data() {
    return {
      btnGroup: ['选项1', '选项2', '选项3']
    }
  }
}
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13

# Attributes

Prop Type Required Default Description
btn-group Array Y [] 按钮组数据
bg-color String N #FFFFFF 背景颜色
select-index Number N 0 当前选中索引
size String N full 尺寸
disabled Boolean N false 是否禁用
needDarkMode Boolean N false 是否需要暗黑模式适配 ^2.5.5

# Events

事件名 说明 回调参数
dofButtonGroupChange 选中变化事件 e.index

← 4.3 圆形按钮（Circle Button） →