首页 > 其他 > 详细

vue点击加载更多——轻松实现vue底部点击加载更多

时间:2019-01-23 16:49:01      阅读:984      评论:0      收藏:0      [点我收藏+]

前言

这里接口直接请求了所有的数据,所以用的就不是分布请求的方法,而是逐步展现的方法

步骤

使用slice来进行限制展现从0,a的数据

<div v-for="user in draw_user.slice(0,a)" :key="user.uid" class="user-item">

//判断a的值是否小于数组的长度,小于就显示点击加载更多 <div class="load-more mr-bottom" v-if="a<draw_user.length" @click=‘loadMore‘ >点击加载更多</div> <div class="load-more mr-bottom" v-else >没有更多了</div>

data中定义a的数值

 data() {
        return {
            a:20
        };
}

methods定义方法

 methods: {
        loadMore:function(){
          this.a+=20;
        }

 

vue点击加载更多——轻松实现vue底部点击加载更多

原文:https://www.cnblogs.com/wangyang0210/p/10309348.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!