Loading.vue 589 B

123456789101112131415161718192021222324252627282930313233343536
  1. <template lang="html">
  2. <div class="loading" v-if="loading">
  3. <img src="/images/all/loading.gif" alt="">
  4. </div>
  5. </template>
  6. <script>
  7. export default {
  8. data: () => ({
  9. loading: false
  10. }),
  11. methods: {
  12. start () {
  13. this.loading = true
  14. },
  15. finish () {
  16. this.loading = false
  17. }
  18. }
  19. }
  20. </script>
  21. <style scoped>
  22. .loading {
  23. position: fixed;
  24. top: 0;
  25. left: 0;
  26. right: 0;
  27. width: 100%;
  28. height: 100%;
  29. z-index: 1000;
  30. text-align: center;
  31. }
  32. .loading img {
  33. position: relative;
  34. top: 40%;
  35. }
  36. </style>