资讯专栏INFORMATION COLUMN

element-ui配合vue分页

zhjx922 / 2677人阅读

摘要:就可以在页面展示了。当然这不是一个好方法,好方法应该是点击页数发送请求呀。我还没想起来怎么写,我后台就一个数组应该怎么拆分呢。

想了好久才想明白分页的问题,不过现在还有问题,就是在v-for 循环的时候分页的,数据一次都请求过来了!!
上代码 核心代码就是一句

vue:      
 data () {
    return {
      currentPage1: 1,
      total: 0,
      pageSize: 6,
      data: []
    }
  methods: {
    handleSizeChange (val) {
      // this.pageSize = val
      console.log(`每页 ${val} 条`);
    },
    handleCurrentChange (val) {
      this.currentPage1 = val;
      console.log(`当前页: ${val}`);
    }

主要是从后台请求回来数据是一个数组,用slice按照当前页面x每页的数量得把返回的数据进行分割。
就可以在页面展示了。当然这不是一个好方法,好方法应该是点击页数发送ajax请求呀。我还没想起来怎么写,我后台就一个data数组应该怎么拆分呢。吼吼吼。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/100340.html

相关文章

  • VUE UI框架对比 element-ui 与 iView

    摘要:而则是用到到指令结合的方式去生成,批量生成元素。表格操作列自定义渲染的时,使用的是的函数,直接在中插入对应模板表格分页都需要引入分页组件配合使用两者总体比较,要比简洁许多。 element VS iview(最近项目UI框架在选型 ,做了个分析, 不带有任何利益相关)主要从以下几个方面来做对比使用率(npm 平均下载频率,组件数量,star, issue…)API风格打包优化与设计师友...

    ZHAO_ 评论0 收藏0
  • 关于vue+element-ui项目的分页,返回默认显示第一页的问题解决

    摘要:所以这就导致,页面内容正确,但是页码高亮依旧是第一页解决办法我们需要在之后刷新这个分页组件或者让分页组件的后于之后加载到页面。然后再次测试,发现完美解决问题。 问题描述 当前页面如下showImg(https://segmentfault.com/img/bVbjJ7a); 然后点击页码跳到第3页,然后在第三页点击页面链接跳转到新的页面showImg(https://segmentfa...

    YFan 评论0 收藏0
  • 使用nuxt开发博客后台管理系统(一)element ui的使用

    摘要:进入主题使用我们在创建项目时已经选择安装了,安装完就能使用了。 注:文章中的nuxt为2.0.0版本 众所周知vue单页面应用的seo很不友好,每次打开页面先获取的节点也就是一个,而这对想用vue做spa又想拥有友好搜索引擎seo优化的人来说就好比鸡肋。好在vue的官方出了nuxt,既能让我们使用spa又能拥有良好的搜索引擎优化;nuxt介绍->https://zh.nuxtjs.or...

    Freeman 评论0 收藏0
  • 开发中遇到的问题总结

    摘要:获取字符串中出现次数最多的字符。去掉字符串中的所有空格中对象数组按对象属性排序 VUE 1、vue——解决You may use special comments to disable some warnings. Use // eslint-disable-next-line to ignore the next line. Use / eslint-disable / to ign...

    wenshi11019 评论0 收藏0
  • 开发中遇到的问题总结

    摘要:获取字符串中出现次数最多的字符。去掉字符串中的所有空格中对象数组按对象属性排序 VUE 1、vue——解决You may use special comments to disable some warnings. Use // eslint-disable-next-line to ignore the next line. Use / eslint-disable / to ign...

    Yuqi 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<