vue项目前端做分页（后端一次性返回所有数据，前端自己分页）

在项目中有些场景会让前端自己来处理分页，实现的方法也很简单，我们只需要用到一个slice方法就可以了。下面是具体的实现步骤：

• 首先是实现一个分页组件，在这里就不具体讲述了，需要知道怎么实现分页组件的小伙伴先阅读下面这个教程
• 前端基于elementui封装分页组件
• 那根据上面的教程在相应的页面引入分页组件后，我们开始对请求回来的数据进行拆分分页

• data () {
      return {
        //暂存数据
        firstData:[],  
        //表格绑定的数据
        tableData:[],
      }
    },
    methods: {
      async gettableData(){
        const res=await api.gettableData()   //发送请求
        this.firstData=res   //将请求的结果赋给中间变量
        this.tableData=this.firstData.slice(0,10)   //假设一页展示10条数据，将首页数据分隔出来
      },
      fatherPage (e) {      //前面封装的组件调用的方法
        this.pageData.page = e
        this.currentPageChangeHandler(this.pageData.page)
      },
      currentPageChangeHandler (page) {   //点击页码或者下一页时对相应的数据进行切割
        this.tableData = this.firstData.slice((page - 1) * 10, page * 10)
      },
  }