编写一个上传文件的组件 tuku,点击图片上传后使用FileReader异步读取文件的内容,读取完成后获得文件名和base64码,调用后端uploadApi,传入姓名和base64文件信息,后端存入nginx中,用于访问
tuku.ts组件代码:
<template>
<!-- 点击后触发方法修改父组件的值 -->
<el-avatar :size="80" src="imgmodelValue1" @click="drawer = true" style="cursor: pointer;">
<img src="https://cube.elemecdn.com/e/fd/0fc7d20532fdaf769a25683617711png.png" />
</el-avatar>
<el-drawer v-model="drawer" title="图片上传" :with-header="false">
<el-upload class="avatar-uploader" :show-file-list="false" :on-change="onChange" :auto-upload="false">
<el-icon class="avatar-uploader-icon"><Plus /></el-icon&