Attachment 附件

以文件芯片形式展示附件名称与大小。

design-spec.pdf242.8 KB

<script setup lang="ts">
import { ref } from 'vue'
import { DanAttachment, type ChatAttachment } from '@dandan-ui/ui'

const file = ref<ChatAttachment | null>({
  name: 'design-spec.pdf',
  size: 248576,
  type: 'application/pdf',
})
</script>

<template>
  <DanAttachment v-if="file" :file="file" removable @remove="file = null" />
  <span v-else style="color: var(--dan-color-text-secondary)">附件已移除</span>
</template>

API

Props

属性	说明	类型	默认值	必填
file	附件信息	ChatAttachment	—	是
removable	是否显示移除按钮	boolean	false	否

ChatAttachment

字段	说明	类型	必填
name	文件名	string	是
id	可选唯一 id	string	否
size	字节大小，用于展示 KB/MB	number	否
type	MIME 类型	string	否
url	预览/下载地址（展示用，组件本身不跳转）	string	否

Events

事件名	说明	回调参数
remove	点击移除	(file: ChatAttachment) => void

Slots

无。