生成中显示停止,空闲时显示重新生成。
<script setup lang="ts">
import { ref } from 'vue'
import { DanGenerationControl } from '@dandan-ui/ui'
const generating = ref(false)
</script>
<template>
<div style="display: flex; gap: 12px; align-items: center">
<DanGenerationControl
:generating="generating"
@stop="generating = false"
@regenerate="generating = true"
/>
<span style="font-size: 13px; color: var(--dan-color-text-secondary)">
{{ generating ? '生成中…' : '空闲' }}
</span>
</div>
</template>| 属性 | 说明 | 类型 | 默认值 | 必填 |
|---|---|---|---|---|
| generating | 是否生成中 | boolean | false | 否 |
| stopText | 停止按钮文案 | string | '停止生成' | 否 |
| regenerateText | 重生成按钮文案 | string | '重新生成' | 否 |
| 事件名 | 说明 | 回调参数 |
|---|---|---|
| stop | 点击停止 | () => void |
| regenerate | 点击重新生成 | () => void |
| 插槽名 | 说明 |
|---|---|
| default | 追加在按钮旁的额外控件 |