vue 项目 页面显示 pdf

背景：vue项目里需要在页面显示pdf 

实现方法：

插件地址

1.install 插件

npm i vue-pdf

2.在页面引入

import pdf from 'vue-pdf'

3.在template中添加

 <pdf :src="'/projects/'+ $store.state.projectId +'/results/050.DESeq2/plotCluster.pdf'" style="width:500px;height:500px"></pdf>

我在项目中用到动态的src，写法如上

也可以加载单个文件 src="../../static/xxx.pdf"

在页面上显示ok～结果如图