按钮 Button

按钮用来触发一些操作。

基础

按钮的 type 分别为 default、primary、info、success、warning 和 error。

<template>
  <div class="flex gap-2">
    <p-button type="default">default</p-button>
    <p-button type="primary">primary</p-button>
    <p-button type="success">success</p-button>
    <p-button type="warning">warning</p-button>
    <p-button type="error">error</p-button>
  </div>
</template>

阴影

<template>
    <div class="flex gap-2">
      <p-button type="default" shadow>default</p-button>
      <p-button type="primary" shadow>primary</p-button>
      <p-button type="success" shadow>success</p-button>
      <p-button type="warning"shadow>warning</p-button>
      <p-button type="error" shadow>error</p-button>
    </div>
  </template>

禁用

<template>
    <div class="flex gap-2">
      <p-button type="default" disabled>default</p-button>
      <p-button type="primary" disabled>primary</p-button>
      <p-button type="success" disabled>success</p-button>
      <p-button type="warning" disabled>warning</p-button>
      <p-button type="error" disabled>error</p-button>
    </div>
  </template>

尺寸

有 small、medium 和 large 尺寸。

<template>
    <div class="flex gap-2">
      <p-button type="primary" size="small" >small</p-button>
      <p-button type="primary" size="medium" >medium</p-button>
      <p-button type="primary" size="large" >large</p-button>
    </div>
  </template>