使用vue.js在网站上显示pdf文档(移动友好)

使用vue.js在网站上显示pdf文档可以通过以下步骤实现：

首先，确保你已经安装了vue.js并创建了一个vue项目。
在vue项目中安装pdf.js库，可以通过npm安装：

npm install pdfjs-dist

在vue组件中引入pdf.js库：

import pdfjsLib from 'pdfjs-dist'

创建一个用于显示pdf的容器：

<div id="pdfContainer"></div>

在vue组件的mounted钩子函数中加载pdf文档并显示：

mounted() {
  const pdfUrl = 'path/to/pdf/document.pdf';
  const container = document.getElementById('pdfContainer');

  pdfjsLib.getDocument(pdfUrl).promise.then(pdf => {
    for (let i = 1; i <= pdf.numPages; i++) {
      pdf.getPage(i).then(page => {
        const canvas = document.createElement('canvas');
        const context = canvas.getContext('2d');
        const viewport = page.getViewport({ scale: 1 });

        canvas.width = viewport.width;
        canvas.height = viewport.height;

        page.render({
          canvasContext: context,
          viewport: viewport
        }).promise.then(() => {
          container.appendChild(canvas);
        });
      });
    }
  });
}

以上代码会加载指定路径的pdf文档，并将每一页渲染到一个canvas元素中，然后将canvas元素添加到指定的容器中。

这种方法可以在移动设备上友好地显示pdf文档，因为它使用了canvas来渲染每一页，而不是依赖于浏览器的内置pdf插件。

推荐的腾讯云相关产品：腾讯云对象存储（COS），它提供了高可靠、低成本的对象存储服务，适用于存储和处理各种类型的文件，包括pdf文档。你可以通过以下链接了解更多关于腾讯云对象存储的信息：腾讯云对象存储（COS）

请注意，以上答案仅供参考，具体实现方式可能因项目需求和环境而有所不同。