首页 > 其他分享 >print-js 实现页面打印PDF,与样式缺失问题

print-js 实现页面打印PDF,与样式缺失问题

时间:2023-07-02 15:01:11浏览次数:51  
标签:样式 打印 js html print PDF 1000

参考

说明

样式缺失是因为默认不继承样式。

环境

软件/系统 版本 说明
dayjs ^1.6.0

步骤

  1. 安装
yarn add print-js
  1. 引入
import print from 'print-js'
  1. 使用

还有很多配置参数,比如传入css的方式,建议查看配置确认

print({
	// 要打印的html的节点id
	printable: "print-dom",
	// 打印类型 html
	type: "html",
	// 继承样式
	targetStyle: '*',
	targetStyles: '*',
	scanStyles: true,
	// 默认800,设置1000是因为我窗口宽度是1000,而导致页面靠近左边,设置1000就正常居中了。
	maxWidth: "1000"
})

标签:样式,打印,js,html,print,PDF,1000
From: https://www.cnblogs.com/xiaqiuchu/p/17520805.html

相关文章

  • dayjs 实现秒转时分秒格式。
    参考https://dayjs.fenxianglu.cn/chatgpt回答环境软件/系统版本说明dayjs^1.11.9步骤安装yarnadddayjs引入//vardayjs=require('dayjs')importdayjsfrom'dayjs'//时间插件importdurationfrom'dayjs/plugin/duration'd......
  • JSON中,java.lang.NoClassDefFoundError: net/sf/ezmorph/Morpher问题解决
    使用JSON,在SERVLET或者STRUTS的ACTION中取得数据时,如果会出现异常:java.lang.NoClassDefFoundError:net/sf/ezmorph/Morpher是因为需要的类没有找到,一般,是因为少导入了JAR包,使用JSON时,除了要导入JSON网站上面下载的json-lib-2.2-jdk15.jar包之外,还必须有其它几个依赖包:commons-bean......
  • 光脚丫思考Vue3与实战:第02章 安装Vue.js
    下面是本文的屏幕录像的在线视频:02-安装Vue.js温馨提示:1、视频下载:线上视频被压缩处理,可以下载高清版本:https://pan.baidu.com/s/16594YUpNNrkjZfrCx7e5kQ 提取码:hws62、示例代码:https://pan.baidu.com/s/1oYV0Lej_E3ufyEUMxq1S2Q 提取码:ikhe 下图是文章大纲: 一、概述Vue.js......
  • 03-Vue.js环境准备-使用vue-cli快速搭建项目(cli3+)
    一、文章大纲二、安装环境本文基于如下的环境进行试验的:Windows10中文64位专业版。v12.18.3版本的Node.js。@vue/cli4.5.4的Vue.js和cli。三、安装vue-cli使用npm全局安装vue-cli:npminstall-g@vue/cli可以使用如下的创建项目的命令,查看vuecli的安装情况:按照上面的提示,先卸载......
  • NextJS项目的部署以及多环境的实现
    背景开发了个Next项目,将部署过程记录一下。另外由于项目准备了两个服务器分别作为开发自测的开发环境和交付给客户的生产环境使用;因此也介绍一下NextJS项目中多环境的配置。项目结构计划是让Nginx根据不同的路径前缀决定请求发给哪个后端;而路径前缀则是由Docker打包镜像的时候......
  • JS中数组的22种常用API
    一、引言前端开发中,数组是一种常见且重要的数据结构。数组提供了许多便捷方便的方法来操作和处理其中的数据。本文将简单介绍前端开发中数组的常用API。二、22种常用方法2.1、push()和pop()push()方法用于向数组末尾增加一个元素,并返回数组最新的长度。constfruits=['......
  • js 使用get 接口如何传递 特殊字符给后端,类似 # 等特殊字符
    今天开发遇到个问题。用户输入了#怎么把文本完整的传递给后端如果直接传输就会出现#之后的东西全都没有,解决方法如下:1,使用其他特殊字符代替,使用replaceAll  //使用replaceAll替换所有#,然后后端再替换回来letnewStr=newQue.replaceAll('#','&')缺点,会......
  • JS传wav文件给后台
    <buttonid="recordButton">开始录制</button>letrecordButton=document.getElementById('recordButton');letmediaRecorder;//媒体实例letchunks=[];//语音文件letisRecording=false;//是正在录制还是停止录......
  • js-遍历两个对象数组,属性值相等的一项合并属性并生成新数组
    operatData.value.seriesList=res.data.seriesList.reduce((accumulator,current)=>{constexisting=userOptionsColor.find(item=>item.name===current.name)if(existing){accumulator.push({...current,...existing})......
  • uni.app 给大家推荐一个 非常牛的 插件 上传图片 上传 word 上传xlsx 上传pdf
     插件地址地址:https://ext.dcloud.net.cn/plugin?name=lsj-upload兼容vue2 vue3微信小程序 等等等等图片放在下面了使用方法里面有介绍又到了码农 最重要的时刻了ctrlc  ctrlv  大法   ......