1,在elementui组件库中选择适合的分页组件el-pagination,导入到项目中,如何修改:page-size="?",:total="?",传递数据值?
<div class="block">
<span class="demonstration">完整功能</span>
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="currentPage4"
:page-sizes="[100, 200, 300, 400]"
:page-size="100"
layout="total, sizes, prev, pager, next, jumper"
:total="400">
</el-pagination>
</div>
2,导入后做如下修改并在data中定义
3,接入后端接口为何不显示呢?
el-pagination的total是integer类型, 如果向后端发送请求,如果后端返回类型如下
说明你返回的total类型为String,这时你的页面显示就为空
此时你只需将返回的total类型转换就可以了,vue中String类型转换为int如何装换?
如:
let str = "123";
let num = parseInt(str);
这时你的分页器内容就会显示了。