vue 3 打印 print-js
1、安装
npm install print-js --save
2、引用
import print from 'print-js'
3、编写打印函数
const enterDialog = async () => {
const style = '@page {margin:0mm 10mm};'//打印时去掉眉页眉尾
printJS({
printable: 'print',// 标签元素id
type: 'html',
header: '',
targetStyles: ['*'],
style
});
}
4、调用函数
<table id="print"></table>
<div class="dialog-footer" style="text-align: center; position: absolute;top: 80px;right: 20px;">
<el-button size="large" @click="enterDialog" style="margin: 5px;">打 印</el-button><br>
<el-button size="large" @click="closeDialog" style="margin: 5px;">取 消</el-button>
</div>
打印最好使用原生table标签,不然可能会出现很大的样式问题
vue 3 打印 print-js的更多相关文章
- vue 中使用print.js 打印遇到的问题 ?
不管怎么设置打印部分的 margin和height 仍会在预览时多出一张空白页?求各位大佬遇到过的请留言谢谢!
- 打印-print.js
//打印开始// strPrintName 打印任务名// printDatagrid 要打印的datagridfunction CreateFormPage(ctx,strPrintName, pr ...
- 使用那各VUE的打印功能(print.js)出现多打印一个空白页的问题
最近这段时间,用VUE写东西,有个打印功能. 百度了一下,铺天盖地的VUE打印的两种实现方法. 很感激这些千篇一律的帖子,虽然不知道他们是否真的用过,还是只是复制粘贴. 至少这些帖子告诉我,是有两个可 ...
- 前端网页打印插件print.js(可导出pdf)
在前端开发中,想打印当前网页的指定区域内容,或将网页导出为多页的PDF,可以借助print.js实现,该插件轻量.简单.手动引入.不依赖其他库.示范项目github:https://github.co ...
- vue实现打印功能的两种方法
第一种方法:通过npm 安装插件 1,安装 npm install vue-print-nb --save 2,引入 安装好以后在main.js文件中引入 import Print from 'v ...
- Atom 编辑器安装 linter-eslint 插件,并配置使其支持 vue 文件中的 js 格式校验
安装方式有如下几种. 1.最常用的安装方式. # 进入atom插件文件夹 cd ~/.atom/packages/ # git clone 插件源文件 git clone https://github ...
- vue中config/index.js:配置的详细理解
当我们需要和后台分离部署的时候,必须配置config/index.js: 用vue-cli 自动构建的目录里面 (环境变量及其基本变量的配置) var path = require('path') ...
- Vue在单独引入js文件中使用ElementUI的组件
Vue在单独引入js文件中使用ElementUI的组件 问题场景: 我想在vue中的js文件中使用elementUI中的组件,因为我在main.js中引入了element包和它的css,并挂载到了全局 ...
- 解决VSCode中使用vetur插件格式化vue文件时,js代码会自动加上冒号和分号
解决VSCode中使用vetur插件格式化vue文件时,js代码会自动加上冒号和分号 在设置中把"vetur.format.defaultFormatter.js": " ...
- print.js继承原有样式
npm install --save print-js import Print from 'print-js' 调用print.js插件 Print({ printable: 'printJS-fo ...
随机推荐
- element-UI 如果获取表格当前行
表格获取当前行的方法,参考element-UI文档上,可以使用作用域插槽获取当前行的数据 // 通过 slot-scope 可以获取到 row, column, $index 和 store(tabl ...
- #Cisco——配置链路聚合
Cisco--配置链路聚合 一.什么是链路聚合. 链路聚合(英语:Link Aggregation)是一个计算机网络术语,指将多个物理端口汇聚在一起,形成一个逻辑端口,以实现出/入流量吞吐量在各成员端 ...
- 阿里巴巴Java代码规范(一)
现代软件架构都需要协同开发完成,高效协作即降低协同成本,提升沟通效率,所谓无规矩不成方圆,无规范不能协作. 本博客是对<阿里巴巴Java开发手册>的学习记录.大多记录的是强制规约,具体请参 ...
- 【个人笔记】从本地源部署 Office 2016 专业增强版
## 0. 大大的说明 本文使用的 Office 2016 为 Office 2016 专业增强版零售版. 零售版需要使用 Office 部署工具才可以自定义安装组件,而 VOL 版本无需部署工具即可 ...
- CentOS7 搭建 PXE 安装系统
1. PXE介绍 2. 服务的搭建 2.1 DHCP服务搭建 2.1.1 安装DHCP软件包 2.1.2 修改dhcp配置文件 2.1.3 开启DHCP服务 2.1.4 查看dhcp服务是否开启 2. ...
- Java Development Kit下载地址
Java Development Kit下载地址 官网下载 一般最新版本无需登录即可下载,其他历史版本需要登录Oracle账户才可以下载. 最新版下载地址: https://www.oracle.co ...
- Pytest之生成allure报告
一.前戏 在之前我们已经学会使用 pytest-html 插件生成 html 格式的测试报告: 1 # 第一步,安装插件 2 pip install pytest-html 3 4 # 第二步,执 ...
- 使用fopen,fscanf等函数报安全性问题的错误,unsafe...
方法一:项目-属性-C/C++-预处理器定义,添加_CRT_SECURE_NO_WARNINGS. 方法二:使用fopen_s,fscanf_s等安全函数.
- php functions 生成唯一码
<?php /** * 微擎密码生成 * */ function we7password($passwordinput, $salt, $authkey) { $passwordinput = ...
- Linux学习 --- 网络基础知识
1.1 IP地址 IP地址由两部分组成 网络号和主机号 .网络号为IP地址的高位组成,而主机号是IP地址的低位组成,两个的大小取决于网络的类型. IP地址根据网络的地址不同分为:A类,B类,C类, ...