[ElPagination] Deprecated usages detected, please refer to the el-pagination doc

调用el-pagination,控制台警告ElementPlusError: [ElPagination] Deprecated usages detected, please refer to the el-pagination documentation for more details

[ElPagination] Deprecated usages detected, please refer to the el-pagination doc_第1张图片

element plus 版本:2.4.4

1 问题代码1

  <el-pagination
    :page-sizes:="[10, 20, 30, 40]"
    :layout="'total, sizes, prev, pager, next, jumper'"
    :total="total"
  />

以上代码会出现以上警告:
total传参类型为number,实际传了string

2 问题代码2

 <el-pagination
    :page-size='size'
    :page-sizes:="[10, 20, 30, 40]"
    :layout="'total, sizes, prev, pager, next, jumper'"
    :total="1"
  />

以上代码会出现以上警告:
传入了page-size,但是没有监听page-size变更的事件(@update:page-size

正确用法

 <el-pagination
    :page-size='size'
    @update:page-size='handlePageSize'
    :page-sizes:="[10, 20, 30, 40]"
    :layout="'total, sizes, prev, pager, next, jumper'"
    :total="1"
  />
 <el-pagination
    v-model:page-size='size'
    :page-sizes:="[10, 20, 30, 40]"
    :layout="'total, sizes, prev, pager, next, jumper'"
    :total="1"
  />

3 问题代码3

 <el-pagination
    :current-page='currentPage'
    :page-sizes:="[10, 20, 30, 40]"
    :layout="'total, sizes, prev, pager, next, jumper'"
    :total="1"
  />

以上代码会出现以上警告:
传入了current-page,但是没有监听current-page变更的事件(@update:current-page

正确用法

 <el-pagination
    :current-page='currentPage'
    @update:current-page='handleCurrentPage'
    :page-sizes:="[10, 20, 30, 40]"
    :layout="'total, sizes, prev, pager, next, jumper'"
    :total="1"
  />
 <el-pagination
    v-model:current-page='currentPage'
    :page-sizes:="[10, 20, 30, 40]"
    :layout="'total, sizes, prev, pager, next, jumper'"
    :total="1"
  />

4 问题代码4

 <el-pagination
    :page-sizes:="[10, 20, 30, 40]"
    :layout="'total, sizes, prev, pager, next, jumper'"
  />

以上代码会出现以上警告:
totalpage-count 必须传一个
正确用法

 <el-pagination
    :page-sizes:="[10, 20, 30, 40]"
    :layout="'total, sizes, prev, pager, next, jumper'"
    :total="total"
  />

element plus 官方解释:
[ElPagination] Deprecated usages detected, please refer to the el-pagination doc_第2张图片

你可能感兴趣的:(element,plus,vue.js,javascript,elementui)