vue cli 项目Element-ui upload 把上传头像 转为base64 保存数据库(头像预览待更新)

本文介绍了如何在Vue CLI项目中利用Element UI的upload组件实现头像上传功能。在onChange事件中,通过getFile()函数检查文件大小和格式,符合条件后使用getBase64()函数将图片转换为base64字符串。接着,将base64数据发送到服务器以更新用户信息,并实现图片回显。
摘要由CSDN通过智能技术生成

使用组件,

:size="46" 这是大小

:limit="1" 最多上传文件数

list-type="picture" 上传文件类型

action=""   上传地址

auto-upload 是否自动上传 (填写false后.上传之后自动弹出一个小框)

accept="image/jpeg" 上传文件的类型,上传界面仅显示该类文件

on-change 事件获取文件信息

<template>
    <div class="PersonalData"  v-if="userData">
        <div class="divs">
            <p class="title">头像</p>
            <el-u
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值