第一次写博客,专门写给菜鸟看的,如果你是老鸟,你可以直接无视。

首先我们从豆瓣api获取到电影的数据列表

然后我们把他们切成一块一块的小数组

最后的数组将会是这样

 原理就是以上的内容,接下来直接附上代码

 注释:computeArr() 这个函数是将所有的数据重新组装成一个新的数组,下面的注释已经很清楚了,这里不必解释太多。

这样handleCurrentChange()这样函数是点击切换页数时候执行的,他将会决定你显示那一页的数据。

以上就是所有内容,最后附上个人的代码demo链接

https://gitee.com/zengjielin/element2.0-page

结合element-ui封装的一个分页函数的更多相关文章

  1. vue2.0 + Element UI + axios实现表格分页

    注:本文分页组件用原生 html + css 实现,element-ui里有专门的分页组件可以不用自己写,详情见另一篇博客:https://www.cnblogs.com/zdd2017/p/1115 ...

  2. 【Django+Element UI】使用一个接口文件,搞定分页获取数据,模糊查询后分页获取数据

    1:序列化获取数据的接口设计 1:分页获取序列化数据 2:是个能传参数的接口 class Society(APIView): def post(self, request): keywords = s ...

  3. vue2.0+Element UI 表格前端分页和后端分页

    之前写过一篇博客,当时对element ui框架还不太了解,分页组件用 html + css 自己写的,比较麻烦,而且只提到了后端分页 (见 https://www.cnblogs.com/zdd20 ...

  4. element ui table(表格)点击一行展开

    element ui是一个非常不错的vue的UI框架,element对table进行了封装,简化了vue对表格的渲染. element ui表格中有一个功能是展开行,在2.0版本官网例子中,只可以点击 ...

  5. vue + element ui 阻止表单输入框回车刷新页面

    问题 在 vue+element ui 中只有一个输入框(el-input)的情况下,回车会提交表单. 解决方案 在 el-form 上加上 @submit.native.prevent 这个则会阻止 ...

  6. 封装一个优雅的element ui表格组件

    现在做后台系统用vue + elementUI 的越来越多,那element ui的 el-table 组件肯定也离不开.虽然element ui的table组件很好.但是表格和分页是分离的.每次写表 ...

  7. 用 customRef 做一个防抖函数,支持 element 等UI库。

    这几天学习Vue的官网,看到 customRef 提供了一个例子,研究半天发现这是一个防抖函数,觉得挺好,于是把这个例子扩展了一下,可以用于表单子控件和查询子控件. 需求 v-model 基于 ele ...

  8. vue+element UI + axios封装文件上传及进度条组件

    1.前言 之前在做项目的时候,需要实现一个文件上传组件并且需要有文件上传进度条,现将之前的实现过程简单记录一下,希望可以帮助到有需要的人. 项目用的是Vue框架,UI库使用的是element UI,前 ...

  9. uinty3d使用ugui封装一个分页控件

    我们在显示数据时有的数据比较多,手机内存有限,我们不可能分配很多的控件来显示这些数据,分页是一个不错的选择.比如玩家交易行.我们现在封装一个自己简单的分页控件来显示玩家交易行. 分页控件的原理其实很简 ...

随机推荐

  1. Comet OJ - Contest #3 B -棋盘 (思维+分类讨论)

    题目描述 小猫有一个 2\times N2×N 的棋盘,每一个格子放着一个黑棋子或白棋子. 小熊觉得小猫的棋盘不够好看,想要把棋盘上的一部分白棋子替换成黑棋子,使得所有黑棋子都能够在仅允许上下左右四个 ...

  2. AtCoder Beginner Contest 088 D Grid Repainting

    Problem statement We have an H×W grid whose squares are painted black or white. The square at the i- ...

  3. HTML加载过程

    在地址栏输入url,返回html后,浏览器开始顺序加载并渲染DOM Body标签 当浏览器遇到body标签才算真正开始加载并渲染DOM,此时会有以下几种情况: DOM元素 浏览器遇到dom元素时,正常 ...

  4. 如何用git将本地代码上传github

    其实去年就用github了,但是毕竟也只是在上面搜索一些工作的难点和自我学习,自己都没有贡献过代码,觉得确实很low,知道今天自己用了2周左右的时间开发了 微信小程序,有了自己的贡献代码,所以想上传到 ...

  5. KCF跟踪算法

    参考:https://www.cnblogs.com/YiXiaoZhou/p/5925019.html 参考:https://blog.csdn.net/shenxiaolu1984/article ...

  6. import Vue form 'vue' 解释

  7. POJ 3764 The xor-longest Path ( 字典树求异或最值 && 异或自反性质 && 好题好思想)

    题意 : 给出一颗无向边构成的树,每一条边都有一个边权,叫你选出一条路,使得此路所有的边的异或值最大. 分析 : 暴力是不可能暴力的,这辈子不可能暴力,那么来冷静分析一下如何去做.假设现在答案的异或值 ...

  8. 改变icon方向

    例你想要箭头朝上的图标而你只有箭头朝下的图标,不幸的是你又没有朝上的图标,那就旋转图标. <i class="icon iconfont _icon-iconfontfanhui4&q ...

  9. #1126-JSP服务器响应

    JSP服务器响应 Response响应对象主要将JSP容器处理后的结果传回到客户端.可以通过response变量设置HTTP的状态和向客户端发送数据,如Cookie.HTTP文件头信息等. 一个典型的 ...

  10. Socket网络通信编程(一)

    1.学习基本概念.传统的同步阻塞式I/O编程.伪异步IO实现 2.学习基于NIO的同步非阻塞式编程 3.了解基于NIO2.0的异步非阻塞(AIO)编程 1.1 基本概念 Socket又称“套接字”,应 ...