Loadmore

加载更多

Loadmore用于实现加载更多的效果,使用比较简单,加上相关的 class 就可以实现这种效果,示例代码如下:

  1. <template>
  2. <div class="page">
  3. <div class="weui-loadmore">
  4. <div class="weui-loading"></div>
  5. <div class="weui-loadmore__tips">正在加载</div>
  6. </div>
  7. <div class="weui-loadmore weui-loadmore_line">
  8. <div class="weui-loadmore__tips weui-loadmore__tips_in-line">暂无数据</div>
  9. </div>
  10. <div class="weui-loadmore weui-loadmore_line weui-loadmore_dot">
  11. <div class="weui-loadmore__tips weui-loadmore__tips_in-line weui-loadmore__tips_in-dot"></div>
  12. </div>
  13. </div>
  14. </template>
  15. <script>
  16. export default {
  17. data() {
  18. return {
  19. }
  20. },
  21. methods: {
  22. }
  23. }
  24. </script>
  25. <style>
  26. </style>

效果

loadmore