vue3使用element-plus中的文件/图片上传功能
elements-plus是一个专门针对v3的一个ui组件库里面有一个组件为upload 我本次用来将图片上传至数据库中。html的内容为:<template><el-uploadclass="avatar-uploader"action="https://jsonplaceholder.typicode.com/posts/":show-file-list="false":on
elements-plus是一个专门针对v3的一个ui组件库
里面有一个组件为upload 我本次用来将图片上传至数据库中。
html的内容为:
<template>
<el-upload
class="avatar-uploader"
action="https://jsonplaceholder.typicode.com/posts/"
:show-file-list="false"
:on-success="handleAvatarSuccess"
:before-upload="beforeAvatarUpload"
>
<img v-if="imageUrl" :src="imageUrl" class="avatar" />
<el-icon v-else class="avatar-uploader-icon"><Plus /></el-icon>
</el-upload>
</template>
我们需要将他改成下格式:
<el-upload
class="avatar-uploader" action="http://backend-api-02.newbee.ltd/manage-api/v1/upload/file"这个地方是我们的接口地址
:show-file-list="false"
:headers="{token:data.token}" 这个地方输入我们获取的token
:on-success="handleAvatarSuccess"
:before-upload="beforeAvatarUpload">
<img v-if="imageUrl" :src="imageUrl" class="avatar" />
<Plus /> //这个组件需要最新版的element-plus才可以使用
</el-upload>
剩下的懒得写了 反正是给我自己看的=。=
更多推荐
所有评论(0)