Use print.js for custom printing (styles can be added)

It’s easy to install dependencies first:

npm install print-js --save
Copy the code

Then introduce:

import print from 'print-js'
Copy the code

Ps: Which page is needed in which page can be introduced

Then use:

<div>
    <p>test print</p>
    <div class="print-div" id="print_area">
        <p class="red"---- Lu Xun </p> <p class="green"---- </p> <p> ---- </p> <p> ---- Lu Xun </p> </div> < button@click ="printSomething"</button> </div>Copy the code
printSomething(){// the style here is the print style const style ='@page { } ' +'@media print { .print-div{ padding:8px; background-color:#cccccc; line-height:12px } .red{ color:#f00} .green{color:green}' ;
    print({
        printable: 'print_area'.type: 'html', style: style,// Can also use imported external CSS; scanStyles:false})}Copy the code

The following is a screenshot:

Attached is the project address:

https://gitee.com/kyle_lin/use-print.git
Copy the code