1000字范文,内容丰富有趣,学习的好帮手!
1000字范文 > vue 利用 vue-print-nb 实现打印功能遇到的问题

vue 利用 vue-print-nb 实现打印功能遇到的问题

时间:2022-12-05 01:04:15

相关推荐

vue 利用 vue-print-nb 实现打印功能遇到的问题

1.首先安装依赖

npm install vue-print-nb --save

2.引用。

import Vue from 'vue'import Print from 'vue-print-nb'Vue.use(Print)

这里需要加上

import Vue from 'vue'

不然会报错

3.打印

<iframe id="printTest" :src="previewUrl" class="el-body" align="center" /><el-button v-print="'#printTest'"></el-button>

这里可能会遇到一个问题:界面显示正常,打印预览的时候要不是空的,要不就是显示不全,大概就是样式不对,这是因为你要打印iframe样式的问题,可能你的样式<stylerel="stylesheet/scss"lang="scss"scope><style> 里面给el-body写了一堆样式,但是打印的时候他不会去把这个样式加上去,这个时候我们只需要把class删掉,把样式写在iframe的style里面

<iframe id="printTest" :src="previewUrl" style="height:100%;width:100%" align="center" />

这样就不会有问题了。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。