Button组件

不同样式

不同尺寸

内行元素

默认按钮smalllarge

<ot-space>
  <ot-button type="primary">默认</ot-button>
  <ot-button type="primary" size="small">small</ot-button>
  <ot-button type="primary" size="large">large</ot-button>
</ot-space>

加载中

点击加载smalllarge

<template>
  <ot-space direction="vertical">
    <ot-button block :loading="loading" type="primary" @click="onClick">
      {{ loading ? '加载中...' : '点击加载' }}
    </ot-button>
    <ot-space>
      <ot-button :loading="loading" type="success" size="small">small</ot-button>
      <ot-button :loading="loading" type="error" size="large">large</ot-button>
    </ot-space>
  </ot-space>
</template>

<script setup>
  import { ref } from 'vue'
  const loading = ref(false)
  const onClick = (e) => {
    loading.value = !loading.value
  }
</script>

禁用

默认默认默认默认