在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组件中

      //用ref绑定打印组件

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

 

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

 

        type="primary"

        size="small"

        @click="printContent"

        style="margin-bottom: 20px"

        >打印xxxx

      >

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

 printContent() {

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

    },

7.配置打印页面样式