前端使用vue.js对后台返回的数据进行分页

最新推荐文章于 2024-08-01 17:00:44 发布

鲨鲨哥

最新推荐文章于 2024-08-01 17:00:44 发布

阅读量4.3k

点赞数 1

分类专栏： Vue 文章标签： Vue

本文链接：https://blog.csdn.net/h__jie/article/details/102658741

版权

本文介绍了如何在前端使用Vue.js处理后台返回的数据，实现分页功能。通过定义CSS样式和编写JavaScript逻辑，实现了纯前端的分页展示。

摘要由CSDN通过智能技术生成

前台页面：

<thead class="has-gutter" v-for="(data,index) in perData2" :key="index">
      
      //循环数据模块，省略

 </thead>

   <tr>

     
       <td colspan="5">

   <ul class="ul" style="">
   <li class="disabled" v-if="pageindex == 1">
      <a href="javascript:;">上一页</a>
   </li>
   
   <li v-else v-on:click="LoadData(pageindex-1)">
   <a href="javascript:;" >上一页</a>
   </li>
          <!--页码-->
   <li v-for="n in totalpages" v-bind:class="pageindex == n ? 'active':'