vue使用饿了么分页器组件,爆出类型错误的解决办法!

297 阅读1分钟

在使用饿了么组件分页器中,经常会在pagesize的里面报类型错误:vue.runtime.esm.js:4597 [Vue warn]: Invalid prop: type check failed for prop "pageSize". Expected Number with value 9, got String with value "9".

image.png

一般这种类型错误的解决办法就是在计算属性中让他强制装换为特定组件所需要的数据类型! 在这里我晒出部分代码!

这里是html部分

<div class="paginations"> 每页显示<input type="number" v-model="tabsnun" @change="changenumber()">行</div>

js部分把绑定的值写在计算属性上

computed:{ tabsnum(){ return Number(this.tabsnun) } },

然后再page里面写返回的计算属性值,如果还报错没那就用$set

<el-pagination @current-change="handleCurrentChange" background layout="prev, pager, next" :page-size="tabsnum" :total="alltanum"> </el-pagination>