vue3 print-js

Question

#在使用vue3 print-js做报告打印的时候出现了一个问题
页面的展示效果都是正常的，但是调用打印的方法，再去看打印预览的时候，部分样式就变了

  <div v-if="focus.length>0">
        <dv-decoration-11 :color="['#1FA174','#99eece']"
                          style="width:200px; height:40px;left: 15px;">
          重点关注
        </dv-decoration-11>
        <ul class="con" style="  padding: 10px 20px;border: 1px solid #1FA174;border-radius: 18px;width: 94%;line-height: 24px;margin: 0 auto;box-sizing: border-box;white-space: pre-wrap;" >
          <li v-for="(item, index) in focus" :key="index" style="text-indent: 2em;white-space: pre-wrap;">
            {{ item }}
          </li>
        </ul>
      </div>

下面是打印的方法

const goPrint = () => {
  const style = '@page { size:180mm 297mm; margin: 0;padding: 0;margin-top:2.2mm;margin-left:6mm;margin-right:6mm;margin-bottom:0mm; } #quality{height: auto!important;overflow: visible!important;}}' ;
  printJS({
    printable: 'quality',
    type: 'html',
    targetStyles: ['*'],
    documentTitle:'Document'});
}

Answer 1

• 你可以参考下这个问题的回答, 看看是否对你有帮助, 链接: https://ask.csdn.net/questions/7771232
• 这篇博客你也可以参考下：vue 使用print-js 打印html页面
• 除此之外, 这篇博客: vue使用print.js打印插件中的 1.安装插件 部分也许能够解决你的问题, 你可以仔细阅读以下内容或跳转源博客中阅读:
  

•  npm install print-js --save