uni-im-load-state.vue

<template>
  <view class="refresh-box">
    <image v-if="status == 'loading'" class="refresh-icon" src="/uni_modules/uni-im/static/run.gif" mode="widthFix"></image>
    <text class="refresh-text">{{status == 'loading'?contentText.contentrefresh:contentText.contentnomore}}</text>
  </view>
</template>

<script>
  export default {
    props: {
      status: {
        type: String,
        default: "loading"
      },
      contentText: {
        type: Object,
        default () {
          return {
            "contentrefresh": "加载中...",
            "contentnomore": "- 没有相关数据 -"
          }
        }
      }
    }
  }
</script>

<style>
  /* #ifndef APP-NVUE */
  view {
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
  }
  /* #endif */
  .refresh-box {
    height: 50px;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    /* #ifdef APP-NVUE */
    width: 750rpx;
    /* #endif */
    flex: 1;
  }
  .refresh-icon {
    width: 25px;
    height: 25px;
    margin: 5px;
  }

  .refresh-text {
    color: #bbb;
    font-size: 14px;
  }
</style>