组件功能

用于触发操作的交互式按钮组件，支持多种样式、尺寸和图标配置。

基础用法

通过 label 设置按钮文本，点击时触发 onClickAction 配置的动作，可结合图标和样式配置自定义按钮外观。

Template 示例：

<Button label="点击按钮" style="primary" />

效果展示如下：

属性说明

属性名 类型 描述 默认值
label string 按钮文本 -
onClickAction ActionConfig 点击事件配置 -
iconStart string 起始图标名称 -
iconEnd string 结束图标名称 -
iconSize "sm" | "md" | "lg" | "xl" | "2xl" 图标尺寸 "md"
submit boolean 是否为提交按钮 false
style "primary" | "secondary" 按钮风格 -
color "primary" | "secondary" | "info" | "success" | "warning" | "danger" 按钮颜色 "primary"
variant "solid" | "soft" | "outline" | "ghost" 按钮变体样式 "solid"
size "3xs" | "2xs" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" 按钮尺寸 "md"
pill boolean 是否为胶囊形状 false
uniform boolean 统一宽度 false
disabled boolean 是否禁用 false
block boolean 是否为块级元素 false

onClickAction 属性说明

onClickAction 用于配置点击 Button 时触发的行为，包括事件类型、数据内容及是否支持多次点击，更多 Action 配置说明详见 Widget Action 使用说明。

字段 类型 描述 默认值
type "sys.chat" | "sys.go_to_url" | "sys.download" 用于定义用户交互后执行的具体行为类型。 -
payload object 提供指定 Action 类型所需的数据内容。 -
alwaysEnabled boolean 是否允许按钮多次点击操作，未配置时默认为单次点击。 false

alwaysEnabled字段配置说明：

  • 默认为false，此时 Button 仅支持单次点击操作，点击一次后自动禁用。

  • 配置为true，此时 Button 支持多次点击操作，即使所在的 Widget 不是最新消息，也支持多次点击。

注意：

alwaysEnabled字段配置为true适用于下载(sys.download)、跳转(sys.go_to_url)等可重复执行的操作，不建议用于sys.chat类型的 Action，以避免重复触发对话请求。

Template 示例：

在该 Template 中，由于alwaysEnabled字段配置为true，下载图片 Button 支持多次点击。

<Button
  label="下载图片"
  onClickAction={{
    type: 'sys.download',
    alwaysEnabled: true,
    payload: {
      url: 'https://cdn.xiaowei.qq.com/static/adp/app-default-avatar.png',
    },
  }}
  style="primary"
  block
/>