loadingAll.vue 830 B

1234567891011121314151617181920212223242526272829303132333435363738394041
  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/loading_all.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. // padding-top: 430rpx;
  35. image {
  36. width: 110rpx;
  37. height: 110rpx;
  38. }
  39. }
  40. </style>