handleTableCh...">
美文网首页
Pagination 分页 一些坑

Pagination 分页 一些坑

作者: 兰夏天 | 来源:发表于2019-11-19 14:17 被阅读0次

    做嵌套表格,子表格要带分页,起初是用 @change="(pagination)=>handleTableChange(pagination)" 同样写在嵌套子表格中,并且,把子表格中写为
    @change="(record.paginationrecord.monthPlanId)=>handleTableChange(record.pagination,record.monthPlanId)"
    因为要用到当前页及条数,但是这种写法无论如何,触发该事件,返回的参数中都不含current 。
    后来单独写了一个分页,
    没有用table 嵌套的分页的事件,
    @change="(record.pagination,record.monthPlanId)=>handleTableChange(record.pagination,record.monthPlanId)",把 嵌套子表格,及单独的分页,用div 包起来,让这个div 作为 大表格下的嵌套。之前渲染不出来是因为,(1)把slot="expandedRowRender" slot-scope="record" 写在table上,(2)后来div,与table 都有,同样也渲染不出来表格。(3)后来把table 上的去掉,就渲染出来了。
    但触发该事件同样分页的current 字段没有。

    后来把 第一个参数改为$event 第二个参依然是record.monthPlanId 在 触发该事件的时候就能返回current属性了。
    无论是用单独的分页,还是写在嵌套子表格上。当触发change 事件的时候都返回了current 属性

       <div slot="expandedRowRender" slot-scope="record" style="width:1050px;overflow:auto">
              <a-table
                :scroll="{ x:1180 }"
                :columns="innerColumns"
                :dataSource="record.dayplandata?record.dayplandata:[]"
                :pagination="record.childpagedata"
                style="font-size:10px;"
                class="tablechild"
                @change="childpagechange($event,record.monthlyPlanID)"
              >
                <span
                  slot="progress"
                  slot-scope="progress">
                  <a-progress :percent="progress" />
                </span>
              </a-table>
            </div>
    

    思考,api 上,明确@change 事件返回的参数,是个对象,这个对象包含分页的各个属性。之前是被父表格中的参数误导了。

    2 关于 $event

    参数的写法,只能保证原函数返回的第一个参数不变。如果原函数返回的参数不止一个,在
    模板中第一个参数用 event ,而后在根据需求写第二个第三个参数等。 `event`这个参数不用卸载methods的方法总,要写在template 模板中对应的html 中,methods中的方法中的参数,继续写该方法返回的第一个参数,及需要接受的第二个第三个参数等

    相关文章

      网友评论

          本文标题:Pagination 分页 一些坑

          本文链接:https://www.haomeiwen.com/subject/rqvwictx.html