<template><div><p>打开新页面预览文件</p><div v-for="(item,index) in list" :key="index"><el-link type="primary" @click="handleOpen(item.url)">{{item.name}}</el-link></div></div>
</template><script>
export default {data () {return {list: [{name: '11111',url: 'https://img0.baidu.com/it/u=1857531512,4041326811&fm=253&fmt=auto&app=138&f=JPEG?w=500&h=728'},{name: '22222',url: 'https://img2.baidu.com/it/u=2212878350,497638050&fm=253&fmt=auto&app=138&f=JPEG?w=333&h=500'},{name: '22222',url: 'https://img2.baidu.com/it/u=2212878350,497638050&fm=253&fmt=auto&app=138&f=JPEG?w=333&h=500'}]}},methods: {// 预览handleOpen (url) {// 预览pdfif (url.includes('.pdf')) {window.open(url, '_blank')} else {var newWindow = window.open('', '_blank')// 构建图片预览的HTMLvar imagePreview = '<img src="' + url + '" alt="Image preview" />'// 向新窗口写入HTML内容if (newWindow) {newWindow.document.write(imagePreview)} else {alert('无法打开新窗口！')}}}}
}
</script><style>
</style>