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

首先我们从豆瓣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. Codeforces Round #430 (Div. 2) - A

    题目链接:http://codeforces.com/contest/842/problem/A 题意:给定l,r,x,y,k.问是否存在a (l<=a<=r) 和b (x<=b&l ...

  2. GUI学习之二十三——QComboBox学习总结

    我们在前面分别介绍了两种输入控件:纯键盘文本输入和步长调节器,下面我们来学习下组合框(下拉选择输入). 一.简介 1.下拉框是一个组合控件(包含一个文本显示控件和一个按钮).它默认显示最小的控件给用户 ...

  3. Python中numpy的应用

    #创建ndarray import numpy as np nd = np.array([2,4,6,'])#numpy中默认ndarray的所有元素的数据类型是相同,如果数据的类型不同,会统一为统一 ...

  4. Vue中的组件及缓存 keep-alive

    <script> import { mapState } from "vuex"; export default { data() {      return {    ...

  5. Netty学习第三章 Linux网络编程使用的I/O模型

    一.同步阻塞IO:blocking IO(BIO) 1.过程分析: 当进程进行系统调用时,内核就会去准备数据,当数据准备好后就复制数据到内核缓冲器,复制完成后将数据拷贝到用户进程内存,整个过程都是阻塞 ...

  6. 2--面试总结-深入理解js线程进阶-宏任务微任务

    前言:Event Loop即时间循环,是指浏览器或Node的一种解决javascript单线程运行时不会阻塞的一种机制,也就是我们经常使用异步的原理 Js运行机制      1.不同运行环境,js运行 ...

  7. CSS3——制作图片翻页的小动画

    觉得还挺有意思的嘻嘻~ 这里有一个问题要注意一下,图片反转过程中可能会遇到一种如下所示的跳变bug: 这玩意一出来吓我一大跳,显然这种用户体验是很不好的,解决方法: 在.pic, .info{...} ...

  8. MySQL两个时间相减

    SELECT TIMESTAMPDIFF(MONTH,'2009-10-01','2009-09-01'); interval可是: SECOND 秒 SECONDS MINUTE 分钟 MINUTE ...

  9. 浙大PAT CCCC L3-014 周游世界 ( 最短路变形 )

    题目链接 题意 : 中文题请点链接,挺复杂的... 分析 : 乍一看是个最短路,实际就真的是个最短路.如果没有 “ 在有多条最短路径的时候输出换乘次数最少的” 这一条件的约束,那么这题就是直接建图然后 ...

  10. codeforces 682C

    鸽了两天,还是我太蒟了,mayan游戏调不出来,难题又不会,只有刷水DFS才能勉强维持一下生计这样子,我还是要提高姿势水平啊! 题目描述: 给定一棵树,每条边有边权,每个点有点权,如果某个点到其子节点 ...