cv-upload-avatar 头像上传

简要

• 头像上传

示例

::: demo

<template>
  <div>
    <h1>上传组件 - 头像</h1>
    <cv-form-base labelWidth="auto">
      <cv-form-item label="全局配置">
        <cv-upload-avatar v-model="formData.avatar" v-model:initValue="formData.avatar_cdn1" />
        <template #tip>默认使用全局配置</template>
      </cv-form-item>
      <cv-form-item label="局部配置">
        <cvUploadAvatar v-model="formData.avatar2" v-model:initValue="formData.avatar_cdn2" />
      </cv-form-item>
    </cv-form-base>
    <h4 style="margin-bottom: 20px"></h4>
    <h4>显示数据</h4>
    <pre style="margin-top: 20px; background: #f6f6f6; padding: 20px; clear: both">{{ formData }}</pre>
  </div>
</template>
<script>
export default {
  data() {
    return {
      formData: {
        avatar: '',
        avatar2: '',
        avatar_cdn1: 'https://10ui.cn/default/avatar/avatar.png',
        avatar_cdn1: '',
        avatar_cdn2: 'https://10ui.cn/default/avatar/avatar.png'
      }
    };
  },
  methods: {
    upResponseFn(response, file) {
      // 需要返回一个 URL
      return file.url;
    }
  },
  mounted() {}
};
</script>

:::

属性

属性名	类型	默认值	说明
v-model/modelValue	String	-	上传后的文件路径
initValue	String	-	初始化
showSize	Number	120	头像大小
fileType	Array	'png', 'jpg', 'jpeg', 'gif'	接受上传的文件类型
fileSize	Number	2	上传的文件大小,单位M
signatureType	String		签名类型
signatureFn	Function		签名方法
upAction	String	-	必选参数，上传的地址
upName	String	file	文件名
upHeaders	Object	-	上传图片携带的header
signatureParam	Object	-	自定义上传数据, 例如