在我们的工作中经常会需要实现一些上传附近的功能,我结合自己在工作中遇到的附件上传功能,以及工作中学习到的一些技能,给大家总结如下:
首先,如果遇到比较简单的附件上传场合,我们可以使用Element UI中的el-upload插件。在使用该插件的时候,可根据自己的需要来设置,无需将官网上的示例一一搬过来。譬如我实现一个上传照片的功能,且照片上传成功后,可显示,当鼠标点在照片上时,可对上传的照片进行重置或删除动作。
我们来看一下咱们的上传部分的代码的如下:
如上图所示,示例代码是html代码,其中uploadUrl表示上传路径,需要自行配备,一般在项目中备好即可。
以上代码是照片上传的一些方法。譬如设置上传的文件的规则,以及上传文件后的一些赋值。包括鼠标移上去以及移除照片的显示。注:CSS相关样式代码不在此处贴上,大家可根据各自的需要去获取。