web 移动 ，打开新的标签页 展示 后端返回的 文件链接 内容

1.定义一个 文件类型 枚举 contact/common

  previewTypes: ['pdf', 'jpg', 'jpeg', 'png', 'gif'], //直接预览
  officeTypes: ['doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx'] //office文件打开

2.封装hooks方法 file.js 

import Eum from '@/contact/common'
export const files = (url) => {
  const temp = url.split('.').pop()
  if (Eum.previewTypes.includes(temp)) {
    //直接预览
    window.open(url, '_blank')
  } else if (Eum.officeTypes.includes(temp)) {
    //通过微软 office 打开
    window.open(`https://view.officeapps.live.com/op/view.aspx?src=${url}`, '_blank')
  } else {
    //直接下载 - 创建 a 标签
    downloadFile(url)
  }
}

const downloadFile = (url) => {
  const link = document.createElement('a')
  link.href = url
  document.body.appendChild(link)
  link.click()
  document.body.removeChild(link)
}

3.在组件 引入 调用 

import {files} from '@/***/files'

  在需要执行的地方调用 并传入 url 链接
  files(url)