vue前端简单分页逻辑

vue前端简单分页逻辑

vue前端简单分页逻辑

data(){
list : [],// 你需要分页的数据
}

<div  v-for="page in Math.ceil(list.length/10)">
      <div  v-for="item in list.slice((page - 1) * 10, page  * 10)">
      	 <div>{{item.name}}</div>
      </div>
 </div>

Math.ceil(list.length/10)得到共有几页

v-for=“item in list.slice((page- 1) * 10, page* 10)”
第一个v-for循环的是页数
第二个根据页数来计算
通过slice（）得到当前页数的数据

附加slice（）的用法