# 上传文件 (File Input)

v-file-input是一个定制的输入组件,它提供了一个干净的选择界面,显示详细的选择信息和上传进度。 它意在直接取代标准文件输入。

# 使用

v-file-input组件的核心是一个基于v-text-field拓展的基本容器

# API

# 示例

# 属性

# Accept(接收格式)

v-file-input组件可以选择接收你想要的媒体格式/文件类型 查看accept attribute文档来获取更多信息。

# 纸片 (Chip)

上传的文件可以作为chip(纸片)显示 同时启用**chips(纸片)multiple(多选)**属性时,每个文件作为一个纸片显示(与选中文件数相反)

# Counter(计数器)

show-size属性和counter一同启用时,会下输入框下方显示文件总数和大小。

# Dense(密集)

您可以使用dense属性降低文件输入高度。

# Multiple(多选)

启用**multiple(多选)**属性可以使v-file-input同时包含多个文件

# Prepend icon(前置图标)

v-file-input拥有一个默认prepend-icon可以设置在组件上或在全局调整。 More information on changing global components can be found on the customizing icons page.

# Show size(显示大小)

show-size(显示大小)属性可以配置显示所选文件的尺寸 显示文件大小可以选择_1024_进位(提供true时默认使用)或_1000_进位

# Validation(验证)

与其他输入类似,您可以使用rules 属性来创建您自己的自定义验证参数。

# 插槽

# Selection(选项)

使用 selection 插槽,您可以自定义输入选择的外观。 通常使用 chips完成,但您可以使用任何组件或标记。

# 其他

# Complex selection slot(复杂选项插槽)

选项插槽的灵活性使其可以容纳复杂的用途。 在本示例中我们展示了如何只显示前两个文件并将剩余数量以计数器显示(当选中三个以上的文件时)

了解更多?

继续学习由 我们的团队 选择的相关内容,或通过使用下面的导航链接在页面之间跳转。
GitHub 上编辑此页面
最后更新:10/07/2024, 11:31:37 AM