element-ui 表头组件封装
listArr : 表单内容
数据格式 : listArr [
{
key必须为tableTitleList 的prop 可以互换 : value 正常值
}
]
tableTitleList :表单表头
数据格式 : tableTitleList: [
{
prop: 'systemID',
name: '育信ID'
},
{
prop: 'userName',
name: '真实姓名'
},
{
prop: 'idNumber',
name: '证件号码'
}
],
condition 为按钮是否显示 初始化为 false
显示按钮 需传入按钮数组
btnTitle: [
{
title: '查看',
name: 'look',
type: 'text'
},
{
title: '编辑',
name: 'edit',
type: 'text'
},
{
title: '删除',
name: 'delete',
type: 'text'
}
],
title : 显示名称 name是调用子组件的返回事件@name='fn' 即可触发事件 返回值为 下标与 对应当前行的对象数据 type :为element-ui组件的按钮对应type
使用方式
如 <组件 @look='fn'></组件>
fn (*index*, *item*) {
// 表格行间下标 与 对应的元素对象
console.log(*index*, *item*)
},
conditionss 是否显示全选 默认 false
将文件放入components文件夹 在main .js 使用
import InformationQuery from 'c/informationQuery'
这里的c 是我在vue.config.js中重新更换的对应 components 文件夹名称 如未修改 可改为 '@/components/informationQuery'
正式调用使用 information-query 进行页面内调用