【Vue: 使用pdf.js顯示PDF Viewer】

Vue環境使用pdf.js顯示PDF Viewer

0. 環境

Vue[Quasar]

1. 方法

• Quasar自封裝的組件qpdfviewer

  • 基於mozila的 pdf.js項目，qpdfviewer組件開箱即用，很方便

  • github docs: https://github.com/quasarframework/app-extension-qpdfviewer

  • npm docs: https://www.npmjs.com/package/@quasar/quasar-app-extension-qpdfviewer for quasar v1

  • Tips: Attention to quasar version!!

  • Install: quasar ext @quasar/qpdfviewer || Unistall: quasar ext remove @quasar/qpdfviewer

  • 需要在 項目 / public 下添加pdf.js文件夾（取自github demo），Install完后，根目錄下quasar.extensions.json記錄了qpdfviewer擴展

  • 代碼參考: 非常齊全https://quasarframework.github.io/app-extension-qpdfviewer/docs

    <q-pdfviewer :src="url" type="pdfjs">
    </q-pdfviewer>
    

    缺點： 因爲直接使用 q u a s a r 的組件不能修改 v i e w e r . h t m l