pdf

package.json

@@ -13,6 +13,7 @@
     "sass-loader": "^12.6.0",
     "vant": "^2.12.45",
     "vue": "^2.6.14",
+    "vue-pdf": "^4.3.0",
     "vue-router": "^3.5.1",
     "vuex": "^3.6.2"
   },

src/views/article/children/articlemain.vue

@@ -8,14 +8,17 @@
         <span class="typetype">文号：{{ item.fileNo }}</span>
       </div>
       <div class="maincontent">
-        <img :src="'http://121.40.214.80:81'+item.downloadUrl" alt="" />
+        <article-pdf :onefilelist="onefilelist"></article-pdf>
+        <!-- <img :src="'http://121.40.214.80:81'+item.downloadUrl" alt="" /> -->
       </div>
     </div>
   </div>
 </template>
 
 <script>
+import ArticlePdf from './articlepdf.vue';
 export default {
+  components: { ArticlePdf },
   name: "ArticleMain",
   props: {
     onefilelist: {

src/views/article/children/articlepdf.vue

@@ -0,0 +1,40 @@
+<template>
+  <div class="ArticlePdf">
+    <pdf ref="pdf" :src="showpdfUrl"> </pdf>
+  </div>
+</template>
+
+<script>
+// 引入PDF插件
+import pdf from 'vue-pdf'
+
+export default {
+  name: "ArticlePdf",
+  components:{
+      pdf
+  },
+  props:{
+      onefilelist:{
+          type:Array,
+          default(){
+              return[]
+          }
+      }
+  },
+  data(){
+      return{
+        //   pdfUrl:""
+      }
+  },
+  computed:{
+      showpdfUrl(){
+          return this.onefilelist.downloadUrl
+      }
+  }
+};
+</script>
+
+<style scoped>
+
+
+</style>