alexwjj/vue-iframe-print

一款支持局部打印的 vue插件

vue-iframe-print

基于 iframe 打印的小工具，原版有些bug，修复了下

原版地址 vue-print-nb

安装

npm install vue-iframe-print --save

import Print from 'vue-iframe-print'

Vue.use(Print);

示例

在线打印示例

你也可以克隆下来本地跑一下

如果你需要扩展功能，可以联系我，或者自己本项目的源文件进行更改

使用姿势

打印整页

<button v-print>打印整页</button>

局部打印:

HTML:

<div id="printDiv">
    且随疾风前行，身后亦需流心
</div>

<button v-print="'#printDiv'">只打印指定 DOM</button>

局部打印扩展

HTML:

<div id="printDiv">
    且随疾风前行，身后亦需流心
</div>

<button v-print="printObj">只打印指定 DOM</button>

Vue JavaScript:

export default {
    data() {
        return {
            printObj: {
              id: "printDiv",
              popTitle: 'vue-iframe-print',
              extraCss: 'https://www.baidu.com/,https://www.baidu.com/',
              extraHead: '<meta http-equiv="Content-Language"content="zh-cn"/>'
            }
        };
    }
}

API

• id: 打印的 ID
• standard: 文档类型, 默认html5, 可选 html5, loose, strict
• extraHead: 扩展头部
• extraCss: 扩展 css
• popTitle: 标题
• endCallback(): 打印成功后回调

vue-iframe-print's Issues

图表打印

当页面中存在echarts图表时，别的都能打印，图表无法打印吗？

在方法里面怎么调用打印，你这个只能在按钮点打印

使用求助

你好，请问你这个demo的printObj怎么打印的啊，也没看见printObj，只看到了printDiv2