element-ui的分页组件的当前页没有实时更新的问题
做项目的时候有个确认收款按钮,点击后会跳到第一页,但是真实效果是数据确实是第一页的,但是组件显示的当前页码还是在之前的页码上
pagination: {
'current-page': 1,
'page-size': 5,
total: 100
}
// 修改数据的地方
this.$set(this.pagination, 'current-page', 1);
这样写了之后发现,分页组件里面的监听除了初始的时候,无论怎么点分页都没起到效果
//element的分页组件被重新封装了
data() {
return {
oOptions: this._options
}
},
watch: {
_options: {
handler: function() {
conle.log(this._options);
},
deep: true
}
}
后来重新看了一下element的分页组件的参数,注意到current-page的说明,支持.sync修饰符,然后给分页组件的current-page添加上.sync修饰符就好了,具体原因不清楚
//这里是分页组件的代码
<el-pagination
prev-text="上一页"
next-text="下一页"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page.sync ="_options['current-page']"
:page-size="_options['page-size']"
:layout="sLayout"
:total="_options.total">
</el-pagination>
网友评论