前端用户上传照片并且给他赋值在easypoi的word模板

在el-ui中创建一个上传组件
可以使用element ui组件库中的upload组件来创建图片上传功能。可以在页面中添加一个upload组件,并设置其props属性如下:
 

<el-upload
  class="avatar-uploader"
  action="/api/upload"
  :show-file-list="false"
  :on-success="handleAvatarSuccess"
  :before-upload="beforeAvatarUpload">
  <img v-if="imageUrl" :src="imageUrl" class="avatar">
  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
</el-upload>

其中,action属性指定后端接口的地址,handleAvatarSuccess和beforeAvatarUpload为回调函数,
用于图片上传成功和上传前的校验。

后端处理上传的图片并返回图片链接
在后端接口中接收到前端上传的图片后,可以使用第三方工具将图片存储到本地或者云端,
并把图片存储的URL返回给前端。

在easypoi的word模板中插入图片
使用easypoi生成word模板时,可以定义word模板中的图片占位符。
当需要插入图片时,可以使用poi-tl插件读取模板并插入图片。
比如,我们可以在模板中定义一个${image}的占位符,然后在代码中使用以下方式将图片插入模板:

Map<String, Object> dataMap = new HashMap<>();
dataMap.put("image", new Pi
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值