app直播源代码，vue+Ant design a-table分页器使用

vue+Ant design a-table分页器使用当前页current设置生效

<br><a-table :columns="columns" :data-source="detail" :pagination="pagination" rowKey="id" @change="tablePaginationChange"><br>  <span slot="serial" slot-scope="text, record, index"><br>    {{ index + 1 }}<br>  </span><br>  <br></a-table>

重点看 :pagination="pagination" 和 @change="tablePaginationChange"

<br>data () {<br>    return {<br>      columns: columns,<br>      detail: [],<br>      pagination: {<br>        current: 1,<br>        // defaultCurrent: 1,<br>        total: 0, // 总数<br>        showSizeChanger: true,<br>        pageSizeOptions: ['1', '10', '20', '40', '80', '100'],<br>        showTotal: total => `共 ${total} 条`, // 分页中显示总的数据<br>        // hideOnSinglePage: true, // 只有一页时是否隐藏分页器<br>        pageSize: 1 // 每页条数，所有页设置统一的条数<br>      }<br>    }<br>    },<br>// 分页发生变化触发的事件<br>methods: {<br>     <br>      tablePaginationChange (pagination) {<br>        // console.log(pagination)<br>        this.pagination.current = pagination.current  // 重新设置当前页<br>        this.pagination.pageSize = pagination.pageSize<br>      }<br>    }<br>created () {<br>      this.$watch('visible', () => {<br>        <br>          const modelId = this.model.id<br>          getDataList({ id: id }).then((res) => {<br>            const pagination = { ...this.pagination }<br>            pagination.current = 1<br>            // 重新设置当前页 才会生效<br>            this.tablePaginationChange(pagination)<br>            this.detail = res.data<br>          })<br>        <br>    })

以上就是 app直播源代码，vue+Ant design a-table分页器使用，更多内容欢迎关注之后的文章