Iview-h-addons NPM

iView Plus

HTable 是基于 iView Table 组件进行扩展的一个新组件,主要用于 列表显示, 自动筛选, 表单生成, 其配置方式与原版类似,在 column 及组件中增加了一些新属性字段.

属性	类型	默认值	说明
size	String	small	默认组件尺寸
request	Promise	无	用于请求列表数据
params	Object, Array	无	请求参数,当数据为Array时,则会自动映射到请求方法的参数中
filter-index	Number	1	当 Params 为 Array 时,需要指定查询参数的索引位置
create	Boolean	False	是否显示创建按钮,开启后将使用自动表单生成页面数据
edit	Boolean	False	是否可编辑
remove	Boolean	False	是否可删除
actionRender	Function	Null	覆盖原有操作列的渲染器
search	Boolean	False	是否可搜索
selection	Boolean	False	是否可选择
pageable	Boolean	False	是否可分页
totalPath	Number	result.total	总数量路径
dataPath	String	Null	数据路径, 如: result.records
columns	Object	Null	基于原版增加了属性,见下表
options	Array	无	附加列,用于在搜索及表单中使用,不会显示在 Table 列表中,字段属性与 Columns 相同
on-submit	Event	无	当表单提交按钮点击并且通过表单验证时会触发此事件(参数: 表单数据, 是否为编辑)
on-remove	Event	无	当点击删除按钮时,触发此事件(参数: 当前选择的行数据)
remove-cb	Promise	无	删除时调用的 Promise 方法,此方法优先于 on-remove
submit-cb	Promise	无	提交数据时调用的 Promise 方法,此方法优先于 on-submit

Column 新增通用属性说明

属性	类型	默认值	说明
searchable	Boolean	False	是否可用于搜索
span	Byte	24	Col Span
require	Boolean	False	是否属于必填项目(用于表单)
type	String	Null	目前支持以下类型: input, number, select
options	Array	Null	当 type 为 select 时用于渲染下拉框选择列表,数据结构见后方说明
request	Function	Null	当 type 为 select 时, 用于实现通过远程接口请求并渲染列表,实际调用的是 HSelect 组件
params	Object	Null	请求参数
tk	String	Null	TitleKey,用于显示列表标题
vk	String	Null	ValueKey,用于设置列表值
dataPath	String	Null	数据路径, 如: result.records
multiple	Boolean	False	是否为多选
onLoaded	Function	Null	HSelect 中使用,当下拉列表数据获取成功后,会触发该事件并附带当前组件, 已选中数据, 数据列表参数
onSelect	Function	Null	当选中时触发事件并附带当前选中值
onInit	Function	Null	初始化完成后触发并附带组件参数

Options 结构说明

[
    {title: '这里是标题', value: '这里是值'},
    {title: '这里是标题2', value: '这里是值2'}
]

例子

<h-select v-model="searchForm.bigTypeNo" :request="requestMethod" :params="{size: 999, page: 1}" nodePath="result.records" vk="ptId" tk="typeName"/>

5 years ago

5 years ago

5 years ago

5 years ago

5 years ago