Vue Vant Uploader文件上传组件
<div>
<van-uploader
v-model="fileList"
multiple
:max-count="1"
:after-read="beforeRead">
<div class="imgsrc">
<span class="icons icon-zhaoxiangji" />
</div>
</van-uploader>
</div>
<style>
.imgsrc {
margin-left: 20px;
background: #eeeeee;
width: 82px;
height: 69px;
}
.icon-zhaoxiangji {
color: #cfcfcf !important;
display: inline-block;
font-size: 12vw !important;
position: relative;
top: 10px;
left: 4.93333vw;
}
</style>
<script>
methods: {
//图片加载完成后的事件(显示图片信息)
beforeRead(file) {
window.console.log(file.file);
}
</script>
用的图标是Vant自带的icon图标
输出结果