1.当我们在el-table里面使用超链接,我们需要使用到el-link标签。
<!-- <el-table-column prop="filePath" label="预览" align="center" min-width="100">
<template slot-scope="scope">
<el-link class="file-list" :href="scope.row.unsignConts[0].filePath" target="_blank">
<svg-icon
icon-class="image"
class="file-icon"
v-if="
scope.row.unsignConts[0].filePath.indexOf('.png') > -1 ||
scope.row.unsignConts[0].filePath.indexOf('.jpg') > -1
"
/>
<svg-icon
icon-class="word"
class="file-icon"
v-else-if="
scope.row.unsignConts[0].filePath.indexOf('.doc') > -1 ||
scope.row.unsignConts[0].filePath.indexOf('.docx') > -1
"
/>
<svg-icon
icon-class="xls"
class="file-icon"
v-else-if="
scope.row.unsignConts[0].filePath.indexOf('.xlsx') > -1 ||
scope.row.unsignConts[0].filePath.indexOf('.xls') > -1
"
/>
<svg-icon
icon-class="pdf"
class="file-icon"
v-else-if="scope.row.unsignConts[0].filePath.indexOf('.pdf') > -1"
/>
<svg-icon
icon-class="txt"
class="file-icon"
v-else-if="scope.row.unsignConts[0].filePath.indexOf('.txt') > -1"
/>
<svg-icon icon-class="unknow" class="file-icon" v-else />
</el-link>
</template>
</el-table-column> -->
2.当然我们也可以点击按钮去跳转链接
<el-button
v-if="scope.row.arr && scope.row.arr.length >0"
type="text"
size="small"
@click="handlePreview(scope.row.arr.filePath)"
>预览</el-button>
函数:
handlePreview(src){
window.open(src,"_blank")
}
判断数组是不是[](前面可以排除是 null,undefined,""的情况)
scope.row.arr && scope.row.arr.length >0
判断对象是不是{}
Object.key(obj).length >0