# 基本表格
设置 showHeaderOverflow:true当表头内容过长时显示为省略号
代码
设置 type=seq 开启序号列
代码
使用 seq-config={seqMethod} 自定义方法
代码
通过 tooltip-config.showAll 开启全表工具提示，还可以配合 contentMethod 方法重写默认的提示内容，显示逻辑完全自定义控制，可以返回 null 使用默认的提示消息
还可以设置 tooltip-config.enterable 允许鼠标进入 tooltip 中，通过 title-help 设置列标题的帮助提示消息
代码
当内容溢出时显示为省略号，show-overflow 和 show-header-overflow 和 show-footer-overflow ellipsis 当内容溢出时显示为省略号
title 当内容溢出时显示为省略号并用原生 title 显示
tooltip 当内容溢出时显示为省略号并用 tooltip 显示
代码
这里只编写增加额外的参数，其他参数具体请查看vxe-grid
如果发现参数或方法不支持，请在组件内增加参数与方法，v-bond的传参在computed中定义
dataListArr：
| 参数名称 | 参数说明 | 是否必填 | 数据类型 | 备注 |
|---|---|---|---|---|
| labelPosition | 对齐方式 | 否 | String | 根据具体目标和制约因素，选择最佳的标签对齐方式。 |
| top | 顶部 | ---- | ||
| left | 左边 | ---- | ||
| right | 右边 | ---- | ||
| center | 中间 | ---- | ||
| --- | --- | --- | --- | --- |
| labelWidth | 表单域标签的的宽度，例如 '50px'。支持 auto | 否 | String | |
| isOverHide | 让设置labelWidth宽度时,可以让超过部分隐藏 | 否 | Boolean | |
| clickExpandMode | 点击展开方式，定位类型可以分遮挡和扩展方法。 | 否 | String | 默认值为position |
| position | 采用相对定位的方式,点击展开不会造成元素页面变化 | ---- | ||
| '' | 只要传入 clickExpandMode！='position'的值就会展开下方内容， | ---- | 后续做扩展用，目前判断条件为此 | |
| --- | --- | --- | --- | --- |
| zhanshi | 放置最外面一层的展示内容 | 否 | Array | 这个变量名临时取,后续最好改下名称 |
| zhankai | 点击展开后，展开的内容 | 否 | Array | 传参方式跟展示参数一样 |
展开展示参数
| 参数名称 | 参数说明 | 是否必填 | 数据类型 | 备注 |
|---|---|---|---|---|
| field | 绑定的字段名 | 是 | String | --- |
| title | label的名称 | 否 | String | --- |
| span | 占取多少单元格 | 是 | Number | 一行分为24 |
| itemRender | 这里采用Render函数生成组件 | --- | --- | --- |
| name | 组件名称 | 是 | String | 组件类型 (除了系统按钮,其他类型都是结成element ui框架组件) |
| $input | 输入框/多行文本(prop传参) | 可以通过props传参，让输入框变成多行文本 | ||
需要自行了解render (opens new window)函数 | ||||
| $inputNumber | 计数器 | |||
| $radio | 单选框 | |||
| $select | 下拉框 | |||
| $switch | 开关 | |||
| $timePicker | 时间选择器 | |||
| $datePicker | 日期选择器 | |||
| $dateTimePicker | 日期时间选择器 | |||
| $colorPicker | 颜色选择器 | |||
| $selectSysbtn | 系统按钮 | |||
| --- | --- | --- | --- | --- |
| props | 自行了解element ui组件参数 | 否 | Object | |
| style | 给组件添加样式 | 否 | String | 比如:style: 'width: 100%' |
| class | 给组件手动增加class样式 | 否 | String | |
| group | $checkbox/$radio | 否 | Object | 复选框和单选框的选择值，但是主要需要下方参数 |
| checkboxData | $checkbox | 否 | Array | 复选框的选择值disabled禁用选择状态,比如: |
| group:{checkboxData:[{value:xxx,label:'xxx',disabled:true}]} | ||||
el-checkbox-button这是复选框的按钮样式 | $checkbox | group:{type:"button",checkboxData:[{value:xxx,label:'xxx',disabled:true}]} | ||
| radioData | $radio | 单选框的选择值disabled禁用选择状态,比如: | ||
| group:{radioData:[{value:xxx,label:'xxx',disabled:true}]} | ||||
el-radio-button这是单选框的按钮样式 | $radio | group:{type:"button",radioData:[{value:xxx,label:'xxx',disabled:true}]} | ||
| --- | --- | --- | --- | --- |
| option | $select | 否 | Object | 下拉框的选择值disabled禁用选择状态,比如: |
| option:{selectData:[{value:xxx,label:'xxx',disabled:true}]} | ||||
| size | 组件大小 | 否 | String | |
| --- | --- | --- | --- | --- |
| rules | 验证方法，采用element form里一样的方法 | 否 | Array | 验证规则 |
| alert | 用于页面中展示重要的提示信息。 | 否 | Object | |
| title | 标题 | 否 | String | |
| type | 主题 | 否 | String | success/warning/info/error，默认info |
| description | 辅助性文字 | 否 | String | |