npm install vue-print-nb --save

?import Print from 'vue-print-nb'
Vue.use(Print)

<div id="main">
這里是要打印的東西
</div>
<!-- 打印按鈕，通過 v-print 調(diào)用打印事件 -->
<button v-print="printObj">打印</button>

export default {
    name: "XssqAddActivity",
    data() {
      return {
         printObj: {
          id: "main",    // 這里是要打印元素的ID
          popTitle: '',  // 打印的標(biāo)題
          extraCss: '',  // 打印可引入外部的一個 css 文件
          extraHead: ''  // 打印頭部文字
        },
      } 
    }
}

/*去除頁眉頁腳*/
  @page{
    size:  auto;   /* auto is the initial value */
    margin: 3mm;  /* this affects the margin in the printer settings */
  }
  html{
    background-color: #FFFFFF;
    margin: 0;  /* this affects the margin on the html before sending to printer */
  }
  body{
    border: solid 1px blue ;
    margin: 10mm 15mm 10mm 15mm; /* margin you want for the content */
  }
  /*去除頁眉頁腳*/

npm install vue-print-nb --save

npm install vue3-print-nb --save

// 1. 全局掛載
import Print from 'vue-print-nb'
Vue.use(Print)
// or
// 2. 自定義指令
import print from 'vue-print-nb'
directives: {
? print
}

// 1. 全局掛載
import { createApp } from 'vue'
import App from './App.vue'
import print from 'vue3-print-nb'
const app = createApp(App)
app.use(print)
app.mount('#app')
// or?
// 2. 自定義指令
import print from 'vue3-print-nb'
directives: {
? ? print ??
}

<!--//通過按鈕來調(diào)用-->
<el-button type="primary" @click="dialogVisible" v-print="printObj">打印</el-button>
<!--//需要打印的頁面-->
<div id="printMe" ref="printContent">
? ? ? ? <div class="hammer">
? ? ? ? ? ? <h3>黃山市機(jī)動車排放維修治理（M）站竣工出廠合格證</h3>
? ? ? ? </div>
? ? ? ? <!-- //內(nèi)容 -->
? ? ? ? <div class="trail">
? ? ? ? ? ? <p>該車經(jīng)我站治理維護(hù)，準(zhǔn)予出廠。</p>
? ? ? ? </div>
</div>

? name: "print",
? data() {
? ? return {
? ? ? pageList: [],
? ? ? status: false,
? ? ? printObj: {
? ? ? ? id: "myPrint", // 這里是要打印元素的ID
? ? ? ? popTitle: "&nbsp", // 打印的標(biāo)題
? ? ? ? extraCss: "", // 打印可引入外部的一個 css 文件
? ? ? ? extraHead: "", // 打印頭部文字
? ? ? },
? ? };
? },

<style>
@page {
? ? size: auto;
? ? margin: 0mm;
? }
</style>

<style>
? .procedure{
? ? ? word-wrap:break-word;
? ?}
</style>