update

src/components/components/vpdf.vue

@@ -1,7 +1,7 @@
 <template>
   <!--使用 pdfvuer 实现 滑动浏览 单印章-->
   <div class="pdf">
-    <div class="loading" v-if="loading">
+    <div class="loading" v-show="loading">
       <span>pdf可能会加载时间有点长，请耐心等待...</span>
     </div>
     <div id="contentArea" class="show">
@@ -135,31 +135,21 @@ export default {
 }
 .pdf {
   height: 100%;
+  width: 100%;
   position: relative;
   box-sizing: border-box;
+  overflow-x: hidden;
+  overflow-y: auto;
 }
 .pdf .show {
-  /* overflow: auto; */
   margin: auto;
   width: 100%;
-  /* height: calc(100%); */
-  /* max-height: 100%; */
-  /* min-height: 100%; */
   display: flex;
   flex-wrap: wrap;
 }
 
 .pdf .show .p-pdf {
-  /* width: calc(100% / 5 - 60px); */
-  width: 100%;
-  /* overflow: hidden; */
-  display: flex;
-  align-items: center;
-  flex-direction: column;
-  justify-content: center;
-  /* margin-bottom: 50px; */
-  /* margin: 25px; */
-  position: relative;
+  overflow: hidden;
 }
 .pdf .show .p-pdf .line {
   position: absolute;

src/components/pdf.vue

@@ -0,0 +1,22 @@
+<template>
+  <div style="height: 100%; overflow: hidden; overflow-x: auto">
+    <Vpdf :pdfUrl="src"></Vpdf>
+  </div>
+</template>
+
+<script>
+import Vpdf from "./components/vpdf.vue";
+export default {
+  components: {
+    Vpdf,
+  },
+  data() {
+    return {
+        src:this.$route.query.src
+    };
+  },
+};
+</script>
+
+<style>
+</style>

src/router/index.js

@@ -20,6 +20,7 @@ import liveProjectDetail from '@/components/liveProjectDetail'
 import audioDemo from '@/components/audioDemo'
 import studyStudent from '@/components/studyStudent'
 import studyStudentGM from '@/components/GM/studyStudentGM'
+import pdf from '@/components/pdf'
 
 Vue.use(Router).use(ElementUI)
 
@@ -134,6 +135,11 @@ export default new Router({
             name: 'studyStudentGM',
             component: studyStudentGM,
             requireAuth: ''
+        },{
+            path: '/pdf',
+            name: 'pdf',
+            component: pdf,
+            requireAuth: ''
         },
     ]
 })