jeecg前端框架之上传图片（vue）

最新推荐文章于 2024-08-02 15:52:30 发布

J_小浩子

最新推荐文章于 2024-08-02 15:52:30 发布

阅读量3.6k

点赞数 2

文章标签： jeecg vue

本文链接：https://blog.csdn.net/change_on/article/details/95094815

版权

本文介绍了在Jeecg前端Vue框架中如何处理图片上传及列表展示的问题。针对Jeecg封装后的Vue语法特性，文中详细讲解了使用模态框进行图片上传，并展示了在数据列表中显示图片的方法。图片上传后存储在本地D盘的upload文件夹，通过系统配置映射。同时，文章提到Jeecg默认的图片缓存方式，并指出如需自定义如FDFS或FTP等远程缓存，需要修改ComController的图片预览方法。

摘要由CSDN通过智能技术生成

jeecg里面的vue是封装过的，语法与原生vue有很大差别，开发时遇到问题，资料也不多，比如现在要讲的图片上传问题。先给出解决方案：

1.模态框
2.列表显示

1.先看模态框怎么展示的，照片用picture表示：

在这里插入图片描述

控件

<a-form-item label="头像" :labelCol="labelCol" :wrapperCol="wrapperCol">
          <a-upload
            listType="picture-card"
            class="avatar-uploader"
            :showUploadList="false"
            :action="uploadAction"
            :data="{'isup':1}"
            :headers="headers"
            :beforeUpload="beforeUpload"
            @change="handleChange"
          >
            <img v-if="picUrl" :src="getAvatarView()" alt="头像" style="height:10