vue的图片上传及获取第一张图片颜色

一.图片上传

1. 首先获取token令牌（请求头）

const headers = ref({
'AdminToken': cookie.get('token') //获取请求头
})

2. 从element复制图片上传代码

 <el-form-item label="广告图片" style="width:100%">
       <el-upload class="avatar-uploader" action=" http://192.168.1.188:8080/upload/admin" :headers="headers"
             :show-file-list="false" :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload">
              <img :src="validateFormAdvertisement.imgUrl"
                    style="width: 200px;height: auto;" />
                    <el-icon>
                        <Plus />
                     </el-icon>
         </el-upload>
 </el-form-item>

注解：

• before-upload传文件之前的钩子，参数为上传的文件，若返回false或者返回 Promise 且被 reject，则停止上传

const beforeAvatarUpload: UploadProps['beforeUpload'] = (rawFile) => {
    if (rawFile.type !== 'image/jpeg') {
        ElMessage.error('图片必须为JPG格式')
        return false
    } else if (rawFile.size / 102