| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374 |
- <!-- -->
- <template>
- <div>
- <iframe
- v-if="pdfShow"
- id="gzfaPdf"
- width="100%"
- height="100%"
- :src="`${hostUrl}/${fileUrl}`"
- color="white"
- background-color="white"
- currentScaleValue="page-width"></iframe>
- <div v-else>
- <p>
- {{fileUrl}}
- </p>
- </div>
- </div>
- </template>
- <script>
- import { hostUrl } from "@util/global_variable.js";
- //这里可以导入其他文件(比如:组件,工具js,第三方插件js,json文件,图片文件等等)
- //例如:import 《组件名称》 from '《组件路径》';
- export default {
- //import引入的组件需要注入到对象中才能使用
- props:['fileUrl'],
- components: {},
- data() {
- //这里存放数据
- return {
- pdfShow:false,
- };
- },
- //监听属性 类似于data概念
- computed: {
- hostUrl(){
- return hostUrl
- }
- },
- //监控data中的数据变化
- watch: {},
- //方法集合
- methods: {
- show(){
- if(this.fileUrl == "暂无文件!"){
- this.pdfShow = false;
- }else{
- this.pdfShow = true;
- }
- }
- },
- //生命周期 - 创建完成(可以访问当前this实例)
- created() {
- },
- //生命周期 - 挂载完成(可以访问DOM元素)
- mounted() {
- this.pdfShow = false
- },
- beforeCreate() {}, //生命周期 - 创建之前
- beforeMount() {}, //生命周期 - 挂载之前
- beforeUpdate() {}, //生命周期 - 更新之前
- updated() {}, //生命周期 - 更新之后
- beforeDestroy() {}, //生命周期 - 销毁之前
- destroyed() {}, //生命周期 - 销毁完成
- activated() {}, //如果页面有keep-alive缓存功能,这个函数会触发
- }
- </script>
- <style scoped>
- </style>
|