vant制作首页的加载中和暂无数据
程序员文章站
2022-06-07 18:08:28
...
<!-- 判断每一页是否有数据,没有则返回暂无数据 -->
<div v-if="newsItems[index].list.length > 0"> </div>
首先先给数据添加一层div判断是否此页能请求到对应数量的数组,能请求则输出
<!-- 页面加载 -->
<div class="loading" v-else-if="newsItems[index].forward ==='before'">
加载中。。。。
</div>
<div class="loading" v-else>
暂无数据
</div>
这两个div则判断状态为before还是after,这个状态的用处就是在点击后还没请求到数据的这个过程显示加载中,否则就为暂无数据例如下图:
完整效果如下图所示
推荐阅读