在vue中实现打印功能（vue-easy-print使用）

1.下载安装vue-easy-print打印插件

npm i vue-easy-print -s

2.在需要打印的页面中导入vue-easy-print

import vueEasyPrint from "vue-easy-print";

3.在组件中注册使用

  components: {

    vueEasyPrint,

  },

4.将需要打印的内容填写在vueEasyPrint组件中

<vueEasyPrint ref="printRef" tableShow>      //用ref绑定打印组件

........需要打印的内容

 </vueEasyPrint>

5.在打印区域外添加打印按钮

 <el-button

        type="primary"

        size="small"

        @click="printContent"

        style="margin-bottom: 20px"

        >打印xxxx</el-button

      >

6.编写打印事件调用打印api

 printContent() {

      this.$refs.printRef.print();  //调用打印内容的print方法

    },

7.配置打印页面样式

 <style scoped>

@page {

  size: auto A4 landscape;

  margin: 3mm;

}

</style>