Ei kuvausta

Loading.vue 956B

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849
  1. <template>
  2. <div class="loadSty">
  3. <el-button :type="loadingComplete?'text':'primary'" :class="{}" :loading="isLoading" @click="up">{{loadMessage()}}</el-button>
  4. </div>
  5. </template>
  6. <script>
  7. export default {
  8. props: {
  9. isLoading: {
  10. type: Boolean
  11. },
  12. loadingComplete: {
  13. type: Boolean
  14. }
  15. },
  16. data() {
  17. return {
  18. loadCon: '点击加载更多'
  19. };
  20. },
  21. methods: {
  22. loadMessage() {
  23. if (this.isLoading) {
  24. this.loadCon = '加载中';
  25. } else {
  26. if (this.loadingComplete) {
  27. this.loadCon = '没有更多数据了';
  28. } else {
  29. this.loadCon = '点击加载更多';
  30. }
  31. };
  32. return this.loadCon;
  33. },
  34. up() {
  35. this.$emit('upup', event.target);
  36. }
  37. }
  38. };
  39. </script>
  40. <style scoped>
  41. .loadSty{
  42. display:flex;
  43. justify-content: center;
  44. padding:20px 0;
  45. }
  46. </style>