CustomTable
CustomTable是基于elementui将表格与分页封装一体的组件,反对失常应用elemenui表格中的属性与办法。
1.应用例子
<CustomTable ref="customTable" :api="'/api/crmemotion/customer-v2/customer-list.do'" :simpleMode="false" :ordered="true" :requestMethod="'post'" @dataUpdates="dataUpdates" > <el-table-column prop="memberId" label="相亲ID" :min-width="TABLELINEWIDTH.ICONID" sortable > <template slot-scope="scope"> <a class="za-tx" href="javascript:void(0)" @click=" common.openPage.customPage( '跟进客户', 'followUpCustomer', scope.row.emotionId, { memberId: scope.row.emotionId, trueMemberId: scope.row.memberId, } ) " > {{ scope.row.memberId !== -1 ? scope.row.memberId : '' }} </a> </template> </el-table-column></CustomTable>
2.属性
2.1.应用elementui table属性
基于elementui的customtable能够间接失常elementui对应的属性、事件、插槽个性等,无再次学习的老本。
2.2.申请接口
api
和requestMethod
、requestConfig
属性发送申请。listName
为接口返回列表名,默认为list
- 目前
requestMethod
申请形式只反对get
、post
申请,同时当申请形式为post时组件外部会将申请格局通过qs.stringify()
格式化,以反对情感crm的post申请参数格局。 requestConfig
用于设置axios申请头配置,传入格局例如:<CustomTable :requestConfig="{ 'Content-Type': 'multipart/form-data' }" />
- 表格外部配有loading属性。
- 胜利申请后组件通过
dataUpdates
事件将返回数据data
传给父组件
2.3.分页
simpleMode
、countOption
、pageCount
设置分页组件属性。
simpleMode
代表分页是否为简略模式,默认值为否。countOption
为页数展现数抉择,仅在一般模式下失效。
2.4.表格配置
ordered
设置表格是否有序号