关于element-ui:封装-基于elementui的表格分页组件

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为页数展现数抉择，仅在一般模式下失效。