yijianbao_user_uniapp/pages_im/components/MyAvatar/index.vue

<template>
 <view style="position: relative;">
 	<u-avatar
 	  @longpress="longpress"
 	  @click="click"
 	  @onError="errorHandle"
 	  :src="getAvatarUrl"
 	  :text="avatarText"
 	  bgColor="#e5e5e5"
 	  :defaultUrl="getDdefaultUrl"
 	  :shape="shape"
 	  :size="size"
 	  mode="aspectFill"
 	  font-size="14">
 	</u-avatar>
 	<slot></slot>
 </view>
   
</template>

<script>

const defaultGroupIcon = "https://bjyjb-1362704775.cos.ap-chongqing.myqcloud.com/shop/image/contact_my_group.png";
const defaultNotifyIcon = "https://bjyjb-1362704775.cos.ap-chongqing.myqcloud.com/shop/image/default_notify_icon.png";
const defaultFaceIcon = "https://bjyjb-1362704775.cos.ap-chongqing.myqcloud.com/shop/image/default_head.png";
export default {
  name: "MyAvatar",
  props: {
    src: String,
    shape: {
      type: String,
      default: "square",
    },
    size: {
      type: String,
      default: "46",
    },
    isGroup: {
      type: Boolean,
      default: false,
    },
    isNotify: {
      type: Boolean,
      default: false,
    },

    desc: String,
  },
  data() {
    return {
      avatarText: undefined,
    };
  },
  computed: {
    getAvatarUrl() {
      if (this.src) {
        return this.src;
      }else{
		return defaultFaceIcon;
	  }
      if (this.isGroup) {
        return defaultGroupIcon;
      }
      if (this.isNotify) {
        return defaultNotifyIcon;
      }
      this.avatarText = this.desc ? this.desc.slice(0, 1) : "未知";
      return "";
    },
    getDdefaultUrl() {
      return this.isGroup ? defaultGroupIcon : undefined;
    },
  },
  methods: {
    errorHandle() {
      this.avatarText = this.desc ? this.desc.slice(0, 1) : "未知";
    },
    redirectShow() {
      if (this.avatarText) {
        this.avatarText = undefined;
      }
    },
    click() {
      this.$emit("click");
    },
    longpress() {
      this.$emit("longpress");
    },
  },
  watch: {
    src() {
      this.redirectShow();
    },
    desc() {
      this.redirectShow();
    },
  },
};
</script>

<style>
	
	
</style>