<template>
  <div class="demo-button-group-base">
    <hive-button-group>
      <hive-button>按钮1</hive-button>
      <hive-button>按钮2</hive-button>
      <hive-button>按钮3</hive-button>
    </hive-button-group>
    <hive-button-group size="large">
      <hive-button theme="primary">按钮1</hive-button>
      <hive-button>按钮2</hive-button>
      <hive-button>按钮3</hive-button>
    </hive-button-group>
    <div>
      <hive-button-group>
        <hive-button size="large">按钮1</hive-button>
        <hive-button size="large">按钮2</hive-button>
        <hive-button size="large">按钮3</hive-button>
      </hive-button-group>
      <hive-button-group>
        <hive-button disabled>按钮1</hive-button>
        <hive-button disabled>按钮2</hive-button>
        <hive-button disabled>按钮3</hive-button>
      </hive-button-group>
    </div>
    <hive-button-group style="width:400px;">
      <hive-button theme="primary" block>按钮1</hive-button>
      <hive-button block>按钮2</hive-button>
      <hive-button block>按钮3</hive-button>
    </hive-button-group>
  </div>
</template>
<script>
  export default {
    data() {
      return {
        data: ['按钮1', '按钮2', '按钮3'],
      };
    },
  };
</script>
