Table 表格 - 导入数据

通过内置的导入功能，可以将 CSV、JSON、TXT、XML、HTML、XLSX 等格式的文件数据导入到表格中，支持多种导入模式和数据校验。

导入数据

最基础的导入方式，通过组件实例方法 openImport() 打开文件选择器。

序号	姓名	年龄	部门	状态	地址

1	张三	28	技术部	在职	北京市朝阳区
2	李四	32	产品部	在职	上海市浦东新区

导入数据

导入 TXT 格式

TXT 格式采用 Tab 分隔列（TSV 格式），与从 Excel 复制粘贴到记事本的格式一致。

TXT 文件格式：

姓名	年龄	部门	状态	地址
王五	25	设计部	在职	广州市天河区
赵六	35	运营部	在职	深圳市南山区

序号	姓名	年龄	部门	状态	地址

1	张三	28	技术部	在职	北京市朝阳区
2	李四	32	产品部	在职	上海市浦东新区

导入 TXT

导入 XML 格式

支持导入标准 XML 格式的表格数据。

XML 文件格式：

<?xml version="1.0" encoding="UTF-8"?>
<table>
  <columns>
    <column name="姓名" />
    <column name="年龄" />
    <column name="部门" />
    <column name="状态" />
    <column name="地址" />
  </columns>
  <rows>
    <row>
      <cell>王五</cell>
      <cell>25</cell>
      <cell>设计部</cell>
      <cell>在职</cell>
      <cell>广州市天河区</cell>
    </row>
  </rows>
</table>

序号	姓名	年龄	部门	状态	地址

1	张三	28	技术部	在职	北京市朝阳区
2	李四	32	产品部	在职	上海市浦东新区

导入 XML

导入 HTML 格式

支持导入包含 <table> 的 HTML 文件，自动识别 <thead> 为表头、<tbody> 为数据。

HTML 文件格式：

<table>
  <thead>
    <tr><th>姓名</th><th>年龄</th><th>部门</th><th>状态</th><th>地址</th></tr>
  </thead>
  <tbody>
    <tr><td>王五</td><td>25</td><td>设计部</td><td>在职</td><td>广州市天河区</td></tr>
  </tbody>
</table>

序号	姓名	年龄	部门	状态	地址

1	张三	28	技术部	在职	北京市朝阳区
2	李四	32	产品部	在职	上海市浦东新区

导入 HTML

导入 CSV 格式

CSV（逗号分隔值）是最通用的表格导入格式，第一行为表头。

CSV 文件格式：

姓名,年龄,部门,状态,地址
王五,25,设计部,在职,广州市天河区
赵六,35,运营部,在职,深圳市南山区

提示： 导入时支持 numberFields 配置自动将指定字段的值转为数字类型。

序号	姓名	年龄	部门	状态	地址

1	张三	28	技术部	在职	北京市朝阳区
2	李四	32	产品部	在职	上海市浦东新区

导入 CSV

导入 JSON 格式

JSON 格式是最精确的导入格式，key 自动匹配列的 prop 或 label。

JSON 文件格式：

[
  { "name": "王五", "age": 25, "dept": "设计部", "status": "在职", "address": "广州市天河区" },
  { "name": "赵六", "age": 35, "dept": "运营部", "status": "在职", "address": "深圳市南山区" }
]

序号	姓名	年龄	部门	状态	地址

1	张三	28	技术部	在职	北京市朝阳区
2	李四	32	产品部	在职	上海市浦东新区

导入 JSON

导入 Excel 格式

支持导入 .xlsx、.xls、.xlsm 格式的 Excel 文件，第一行为表头，列名需与表格列的 label 或 prop 对应。

提示： Excel 导入依赖 xlsx 库进行解析，功能强大且兼容性好。

序号	姓名	年龄	部门	状态	地址

1	张三	28	技术部	在职	北京市朝阳区
2	李四	32	产品部	在职	上海市浦东新区

导入 Excel

高级导入

可配置导入格式、导入模式、最大行数限制，并通过 beforeImport / afterImport 进行数据校验和回调。

格式：CSVJSONTXTXMLHTMLExcel模式：顶部追加尾部追加覆盖最大行数：

序号	姓名	年龄	部门	状态	地址

1	张三	28	技术部	在职	北京市朝阳区
2	李四	32	产品部	在职	上海市浦东新区

高级导入

服务端导入

对于大文件或需要后端校验的场景，建议将文件上传到服务端处理，服务端解析后返回标准 JSON 数据再加载到表格中。

序号	姓名	年龄	部门	状态	地址

1	张三	28	技术部	在职	北京市朝阳区
2	李四	32	产品部	在职	上海市浦东新区

服务端导入

导入模式说明

模式	值	说明
顶部追加	'insertTop'	将导入数据插入到表格最前面
尾部追加	'insertBottom'	将导入数据追加到表格末尾（默认）
覆盖	'covering'	清空原有数据，用导入数据完全替换

支持的导入格式

格式	扩展名	说明
CSV	.csv	逗号分隔值，第一行为表头
JSON	.json	对象数组，key 对应列 prop
TXT	.txt	Tab 分隔值（TSV），第一行为表头
XML	.xml	标准 XML 格式，含 <columns> 和 <rows>
HTML	.html	标准 <table> 结构，含 <thead> 和 <tbody>
XLSX	.xlsx	Excel 格式，支持 .xlsx、.xls、.xlsm

数据映射规则

导入时按以下优先级匹配列：

1. 自定义 fieldMapping 配置（最高优先）
2. 文件字段名与列 prop 完全一致
3. 文件字段名与列 label 完全一致

提示： 无法匹配的字段将被忽略。通过 numberFields 可指定需要自动转为数字的列。

API

openImport(config?) 方法

通过表格实例调用，打开文件选择器并导入数据。

参数	说明	类型	默认值
type	导入格式	'csv' | 'json' | 'txt' | 'xml' | 'html' | 'xlsx'	自动推断
mode	导入模式	'covering' | 'insertTop' | 'insertBottom'	'insertBottom'
separator	CSV 分隔符	string	','
fieldMapping	字段映射：文件列名 → prop	Record<string, string>	—
autoMapping	是否自动映射 label/prop	boolean	true
numberFields	数值类型字段列表	string[]	—
maxRows	最大导入行数	number	—
encoding	文件编码	string	'utf-8'
beforeImport	导入前校验	(rows) => boolean | rows[]	—
afterImport	导入后回调	(rows, mode) => void	—
sheetIndex	读取的工作表索引（仅 XLSX）	number	0
sheetName	读取的工作表名称（仅 XLSX，优先于 sheetIndex）	string	—
headerRow	是否将第一行作为表头（仅 XLSX）	boolean	true

importFile(file, config?) 方法

从 File 对象导入数据。

importData(content, config?) 方法

从文本字符串或对象数组导入数据。