前端框架

vue使用print.js实现前端打印

2021-08-27  本文已影响0人  伴歌知行

最近公司项目要求前端打印小票,感觉print.js使用起来比较方便

1、下载print.js

点击print.js进行下载,将print.js放到项目中

2、在项目main.js中引用print.js

import Print from '@/js/print'  // 这里是你的print放置的地址
Vue.use(Print)

3、在组件中使用

<template>
  <div ref="print">
    打印内容
    <div class="no-print">不要打印我</div>
  </div>
  <button @click="doPrint">打印</button>
</template>

<script>
export default {
    methods: {
        doPrint() {
            this.$print(this.$refs.print) // 使用
        }
    }
}
</script>

但是这个方法不能实现直接打印,直接打印 必须使用控件才可以,下篇再说吧

上一篇下一篇

猜你喜欢

热点阅读