前言:在项目需求中有遇到将当前的表格信息打印出来的功能,将网上的方法整理成一个详细的操作步骤,希望多点点赞噢~
1.引入插件
这里采用的插件是 vue-print-nb
安装
npm install vue-print-nb --save
在vue文件中的main.js文件中注册
import Print from 'vue-print-nb'
Vue.use(Print);
2.在vue文件中使用
<template>
<div id="printMe" ref="print" v-show="isPrint">
<p>这里面就是需要打印的内容</p>
</div>
<button @click="print">打印</button>
</template>
<script>
export default{
data(){
return{
isPrint:false, //控制当前打印页面是否显示
}
},
methods:{
print(){
this.isPrint = true,
setTimeout(()=>{
this.isPrint = false
},100)
}
}
}
</script>