1.window.open
<!-- html -->
<div class="form-item" style="align-items: flex-start;">
<div style="text-align: center;">
<el-upload
id="fileUrl"
ref="fileUrl"
:action="baseUrl+'upload/upFile'"
:headers="getLoginHeaders()"
:limit="1"
:on-success="uploadSuccess"
:before-remove="beforeRemove"
:accept="accept"
:file-list="fileList"
>
</el-upload>
</div>
<div style="text-align: center; position: absolute">
<el-button
type="primary"
size="mini"
icon="el-icon-document"
@click="download(fileList)">预览附件</el-button>
</div>
</div>
<!-- 预览附件 js -->
download :function(url){
window.open(url[0].url);
},
2.创建一个a标签
<!-- on-preview -->
<el-col :span="12">
<div class="form-item" style="align-items: flex-start;">
<div style="margin-top: 3px;">上传附件</div>
<el-upload
id="fileUrlAudit"
ref="fileUrlAudit"
:action="baseUrl+'upload/upFile'"
:headers="getLoginHeaders()"
:limit="1"
:on-success="uploadSuccess"
:before-remove="beforeRemove"
:accept="accept"
:file-list="fileList"
:on-preview = "openFile"
>
<el-button size="small" type="primary">点击上传</el-button>
</el-upload>
</div>
</el-col>
<!-- js 预览附件 -->
openFile: function (e) { // 点击上传的文件列表的文件的操作
// console.log(e, "点击上传的文件列表的文件的操作");
var a = document.createElement("a");
// console.log(a, "创建a");
var event = new MouseEvent("click");
a.target = "_blank";
a.download = e.name;
a.href = JSON.parse(e.url)[0];//路径前拼上前缀,完整路径
a.dispatchEvent(event);
},