在一般的环境中,使用jcp,只需要引入安装包中提供的 jcp.js就行了,但在vue环境中,这个jcp.js不能直接拿来用,而需要稍加改动后,再引入。具体方法如下:
1. 下载 JCP for vue 软件包,
http://print.jatools.com/download/jcp4vue.zip;
2. 软件包中的 jcp-vue.js 复制到你的vue项目中;
3. 在需要打印的页面中,这样来使用:
复制内容到剪贴板
代码:
import {getJCP} from '../common/jcp-vue'
new Vue({
el : '#app',
methods : {
doPrint : function(how) {
var myDoc = {
documents : document, // 打印页面(div)们在本文档中
copyrights : '杰创软件拥有版权 www.jatools.com' // 版权声明必须
};
var jcp = getJCP();
// 调用打印方法
if (how == '打印预览')
jcp.printPreview(myDoc, false);
else if (how == "打印预览(显示进度条)") {
jcp.printPreview(myDoc, true);
} else if (how == '弹出打印机选择对话框打印') {
jcp.print(myDoc, true);
} else
jcp.print(myDoc, false); // 不弹出对话框打印
}
}
})
4. 将软件包中的 setup.exe 安装到客户端,注意,此JCP 为 VUE演示专用,不能用来浏览官网的在线示例;
5. 测试你的打印网页。
2019/11/20 更新