vue 图片转base64传到后台
发现好多原生js、jq获取的、vue里面的例子好少注意不要传参数!methods里面写方法:onUpload(e) {var file = e.target.files[0]var reader = new FileReader()var that = thisreader.readAsDataURL(file)
·
传文件:
1传流
2传base64
2明显优于1
<img data-cke-saved-src="https://img-blog.csdnimg.cn/2022010614561426344.png" src="https://img-blog.csdnimg.cn/2022010614561426344.png" alt="" />
注意不要传参数!
methods里面写获取base64的方法:主要用:FileReader
//获取文件
var file = $("#imgForm").find("input")[0].files[0];
//创建读取文件的对象
var reader = new FileReader();
//创建文件读取相关的变量
var imgFile;
//为文件读取成功设置事件
reader.οnlοad=function(e) {
alert('文件读取完成');
imgFile = e.target.result;
console.log(imgFile);
$("#imgContent").attr('src', imgFile); // 可以直接显示图片
};
//正式读取文件
reader.readAsDataURL(file);
拿到base 传递给后台就可以了
后面就不写了、大家都会。
效果图(base64打在地址):
当然还可以html5的formData获取流:
待续~~
更多推荐
已为社区贡献17条内容
所有评论(0)