vue 使用vue-print-nb 实现打印功能 和 用针式打印机打印模糊问题

一、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;