vue3 pdf在线预览

根据引用提供的信息，可以得知vue-pdf并不支持Vue3。但是，我们可以使用其他方法实现Vue3中的PDF在线预览功能。一个可行的方法是使用iframe嵌套。以下是一个示例代码：

// 在template中添加iframe标签
<iframe id='pdf' ref='pdf' height='100%' :src='pdfUrl' width='100%' />

// 在script中编写逻辑
const Token = store.getters['user/token'] // 获取token

// 获取文件流的url
let url = fileUrl

// 如果需要带token，则使用fetch请求文件流，并转换为可预览的格式
// 并将转换后的文件流url赋值给pdfUrl
if (Token) {
  const res = await fetch(url, {
    method: 'GET',
    headers: {
      'Authorization': Token,
    },
  })
  const blob = await res.blob()
  let arr = []
  arr.push(blob)
  let pdfUrl = URL.createObjectURL(new Blob(arr, { type: 'application/pdf' }))
  this.pdfUrl = '/static/pdf/web/viewer.html?file=' + encodeURIComponent(pdfUrl)
} else {
  // 如果不需要带token，则直接使用文件流url
  this.pdfUrl = '/static/pdf/web/viewer.html?file=' + encodeURIComponent(url)
}

// 如果需要在pdf加载完成后执行一些逻辑，可以添加以下代码
const iframe = document.querySelector('#pdf')
if (iframe.attachEvent) {
  iframe.attachEvent('onload', function() {
    // 在加载完成后执行的逻辑
  })
} else {
  iframe.onload = function() {
    // 在加载完成后执行的逻辑
  }
}

通过以上方法，可以实现在Vue3中进行PDF在线预览。请根据自己的实际情况进行适当的调整。