结合element-ui封装的一个分页函数
第一次写博客,专门写给菜鸟看的,如果你是老鸟,你可以直接无视。
首先我们从豆瓣api获取到电影的数据列表

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

最后的数组将会是这样

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



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

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

以上就是所有内容,最后附上个人的代码demo链接
https://gitee.com/zengjielin/element2.0-page
结合element-ui封装的一个分页函数的更多相关文章
- vue2.0 + Element UI + axios实现表格分页
注:本文分页组件用原生 html + css 实现,element-ui里有专门的分页组件可以不用自己写,详情见另一篇博客:https://www.cnblogs.com/zdd2017/p/1115 ...
- 【Django+Element UI】使用一个接口文件,搞定分页获取数据,模糊查询后分页获取数据
1:序列化获取数据的接口设计 1:分页获取序列化数据 2:是个能传参数的接口 class Society(APIView): def post(self, request): keywords = s ...
- vue2.0+Element UI 表格前端分页和后端分页
之前写过一篇博客,当时对element ui框架还不太了解,分页组件用 html + css 自己写的,比较麻烦,而且只提到了后端分页 (见 https://www.cnblogs.com/zdd20 ...
- element ui table(表格)点击一行展开
element ui是一个非常不错的vue的UI框架,element对table进行了封装,简化了vue对表格的渲染. element ui表格中有一个功能是展开行,在2.0版本官网例子中,只可以点击 ...
- vue + element ui 阻止表单输入框回车刷新页面
问题 在 vue+element ui 中只有一个输入框(el-input)的情况下,回车会提交表单. 解决方案 在 el-form 上加上 @submit.native.prevent 这个则会阻止 ...
- 封装一个优雅的element ui表格组件
现在做后台系统用vue + elementUI 的越来越多,那element ui的 el-table 组件肯定也离不开.虽然element ui的table组件很好.但是表格和分页是分离的.每次写表 ...
- 用 customRef 做一个防抖函数,支持 element 等UI库。
这几天学习Vue的官网,看到 customRef 提供了一个例子,研究半天发现这是一个防抖函数,觉得挺好,于是把这个例子扩展了一下,可以用于表单子控件和查询子控件. 需求 v-model 基于 ele ...
- vue+element UI + axios封装文件上传及进度条组件
1.前言 之前在做项目的时候,需要实现一个文件上传组件并且需要有文件上传进度条,现将之前的实现过程简单记录一下,希望可以帮助到有需要的人. 项目用的是Vue框架,UI库使用的是element UI,前 ...
- uinty3d使用ugui封装一个分页控件
我们在显示数据时有的数据比较多,手机内存有限,我们不可能分配很多的控件来显示这些数据,分页是一个不错的选择.比如玩家交易行.我们现在封装一个自己简单的分页控件来显示玩家交易行. 分页控件的原理其实很简 ...
随机推荐
- Codeforces 946 课程表背包DP 数位DFS构造
A B 给你A,B 两个数 1.a=0 OR b=0 break 2.a>=2b a=a-2b 3.b>=2a b=b-2a 如果只是单纯模拟肯定会超时 ...
- 在 LaTeX 中同步缩放 TikZ 与其中的 node
PGF/TikZ 是 Till Tantau 开发的基于 TeX 的绘图引擎.因其可以直接在 LaTeX 文稿中通过代码绘制向量图,所以是目前流行的 LaTeX 绘图解决方案之一. 在 tikzpic ...
- java.sql.SQLException: Unknown system variable 'query_cache_size'
改为 <dependency> <groupId>mysql</groupId> <artifactId>mysql-connector-java< ...
- HTML与CSS中的颜色与单位个人分享
颜色与单位 Web安全色有216中其中色彩有210中,非色彩6中 前景色与背景色 前景色就是设置字体的颜色 背景色就是为指定元素设置背景色 - 浏览器默认背景色的颜色为透明色 颜色的命名 1.使用单词 ...
- 自学semantic UI个人博客首页模板
以下是代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <m ...
- 推荐一些CSS命名规范
常用的CSS命名规则 头:header内容:content/container尾:footer导航:nav侧栏:sidebar栏目:column页面外围控制整体佈局宽度:wrapper左右中:left ...
- Ldap 从入门到放弃(二)
OpenLDAP 服务器安装与配置 本文内容是自己通过官网文档.网络和相关书籍学习和理解并整理成文档,其中有错误或者疑问请在文章下方留言. 一.概述 本文以Centos 6.8(64bit)为例介绍 ...
- table表格 td设置固定宽度
table宽度自适应,而且部分TD是固定宽度. 只需要将固定宽设死,留下一列不设置宽度,将table宽度设置为100%. table-layout:fixed 作用不是很清楚 <table wi ...
- angularjs表单注册--两次密码验证
html <div class="container" ng-controller="RegisterCtrl"> <form name=&q ...
- python+selenium模拟京东登录后台
python+selenium模拟京东登录后台 import json from time import sleep from selenium import webdriver #from sele ...