loadingAll.vue 801 B

12345678910111213141516171819202122232425262728293031323334353637383940
  1. <template>
  2. <view v-show="loadingShow">
  3. <view class="request-loading-view">
  4. <!-- <view class="loading-view"><view class="loading"></view></view> -->
  5. <image src="https://hzchart.oss-cn-shanghai.aliyuncs.com/cygx/all-loading.gif"></image>
  6. </view>
  7. </view>
  8. </template>
  9. <script>
  10. export default {
  11. data() {
  12. return {};
  13. },
  14. computed: {
  15. //计算属性判断vuex中的显示状态
  16. loadingShow() {
  17. return this.$store.state.requestLoading;
  18. },
  19. },
  20. };
  21. </script>
  22. <style lang="scss" scoped>
  23. .request-loading-view {
  24. position: fixed;
  25. top: 0;
  26. left: 0;
  27. width: 100%;
  28. height: 100%;
  29. z-index: 10000;
  30. background-color: rgba(0, 0, 0, 0.6);
  31. display: flex;
  32. justify-content: center;
  33. align-items: center;
  34. image {
  35. width: 270rpx;
  36. height: 282rpx;
  37. }
  38. }
  39. </style>