这里写目录标题

一、vue-print-nb 实现打印功能1、安装2、在main.js 中引入3、在vue页面中的使用4、打印分页 `style="page-break-after: always"`二、网页 用针式打印机打印模糊问题

一、vue-print-nb 实现打印功能

1、安装

cnpm i vue-print-nb -S

2、在main.js 中引入

import Print from 'vue-print-nb'

Vue.use(Print)

3、在vue页面中的使用

<template><div class="print"><div id="printPage">这里面是放的打印内容</div><button v-print="'#printPage'">打印</button></div></template>

v-print 中的内容 和 id对应，打印出来的内容是 整个id框框内的内容

4、打印分页style="page-break-after: always"

<template><div class="print"><div id="printPage">// 这里面是放的打印内容<div style="page-break-after: always">// 打印的第一页内容</div><div style="page-break-after: always">// 打印的第二页内容</div></div><button v-print="'#printPage'">打印</button></div></template>

二、网页 用针式打印机打印模糊问题

原因：网页的打印，是先生成一张图片，接着打印，针式打印机打印会模糊；

解决：试着调整打印的文字的字体，我这里：

font-family: Microsoft YaHei;color: #000;