vue使用printJS實現批量打印及單個打印 避免空白頁

本文介紹了使用print-js庫實現批量打印功能的實現方法。通過安裝print-js依賴后,創建一個batchPrintAction方法,該方法接收選中行數據,生成包含多個標簽頁的HTML字符串。每個標簽頁以表格形式展示6個數據字段,并設置了80mm×50mm的標簽尺寸。方法使用PrintJS進行打印,配置了打印樣式和頁面設置,并在打印完成后移除臨時創建的DOM元素。該實現支持批量打印和單條數據打印,包含數據驗證和樣式自定義功能。 

首先安裝依賴

npm i 'print-js'
//或者
yarn add 'print-js'

 調用batchPrintAction方法 ,可根據開發需要自行設計樣式及數據

import printJS from "print-js";const batchPrintAction = (row) => {const selectdata = row ? [row] : selectedRows.value;if (selectdata.length === 0) {ElMessage.warning("請先選擇要打印的數據");return;}// 創建一個包含所有選中行數據的HTML字符串,每個

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/pingmian/88571.shtml
繁體地址,請注明出處:http://hk.pswp.cn/pingmian/88571.shtml
英文地址,請注明出處:http://en.pswp.cn/pingmian/88571.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

C++ 選擇排序、冒泡排序、插入排序

選擇排序:是一種簡單直觀的排序算法,每次均是選擇最小(大)的元素進行排序。選擇排序算法思想:1 在未排序序列中找到最小(大)元素,存放到排序序列的起始位置2 再從剩余未排序元素中繼…

Linux入門篇學習——Linux 編寫第一個自己的命令,make 工具和 makefile 文件

目錄 一、Linux 編寫第一個自己的命令 1.命令的概念 2.定義一個自己的命令 二、make 工具和 makefile 文件 1.使用 make 工具 2.makefile文件 一、Linux 編寫第一個自己的命令 1.命令的概念 命令就是可執行程序。 比如說我們輸入 ls -al ,ls 就是可執行程序的…

實驗一 接蘋果

主要步驟蘋果樹制作(蘋果與籃子的制作同理)為蘋果添加標簽相機位置設置與游戲面板長寬比設置(16:9)蘋果下落設置(將蘋果從平拋運動改為垂直下落)通過設置物理圖層并更改碰撞矩陣表實現通過PlayerPrefs實現游…

Nginx服務器集群:橫向擴展與集群解決方案

橫向擴展:基礎概念 在深入了解Nginx的橫向擴展細節之前,首先理解橫向擴展的含義及其重要性。橫向擴展是指通過增加服務器數量來分散負載并提升整體性能。這與縱向擴展形成對比,縱向擴展是指在單個服務器上增加更多資源(如CPU、內…

缺陷的生命周期(Bug Life Cycle)是什么?

一、缺陷生命周期的定義缺陷生命周期是指一個Bug從被發現到最終關閉的完整流程,反映了缺陷在不同角色(測試、開發、產品等)間的流轉狀態。它是軟件測試流程的核心管理模型,直接影響團隊協作效率。二、標準缺陷生命周期階段以下是通…

AtCoder Beginner Contest 333(A,B,C,D,E,F)

AtCoder Beginner Contest 333 A 題意 輸出n個n(n<9) 代碼 #include<bits/stdc.h> using namespace std; void solve(){int n;cin>>n;for(int i1;i<n;i)cout<<n; } signed main(){ios::sync_with_stdio(0),cin.tie(0),cout.tie(0);int T__1;//cin…

留學真相:凌晨兩點被海關攔下時,我才明白人生沒有退路

> 獨立不是選擇&#xff0c;而是生存的必修課下飛機那一刻&#xff0c;幻想中的“鍍金生活”瞬間崩塌。倫敦海關凌晨兩點的燈光下&#xff0c;你顫抖著翻找學校文件&#xff0c;手機信號格空空如也&#xff1b;大巴誤點后&#xff0c;你拖著兩個32公斤的行李箱站在陰雨中&am…

探索AIGC領域DALL·E 2的圖像生成與人類創意的融合

探索AIGC領域DALLE 2的圖像生成與人類創意的融合關鍵詞&#xff1a;AIGC、DALLE 2、圖像生成、人類創意、創意融合摘要&#xff1a;本文聚焦于AIGC領域中DALLE 2的圖像生成技術與人類創意的融合。首先介紹了相關背景&#xff0c;包括DALLE 2的發展歷程和人類創意在藝術創作中的…

【ECharts】多個ECharts版本共存解決方案

多個ECharts版本共存解決方案 在單個HTML頁面中使用多個ECharts版本的關鍵在于避免全局命名空間沖突。下面我將展示一個完整的解決方案&#xff0c;包含兩種不同的實現方法。 解決方案思路命名空間隔離法&#xff1a; 使用不同的全局變量名保存不同版本的ECharts在加載新版本前…

力扣熱門算法題 204.計數質數,207.課程表,213.打家劫舍II

力扣熱門算法題 204.計數質數&#xff0c;207.課程表&#xff0c;213.打家劫舍II&#xff0c;每題做詳細思路梳理&#xff0c;配套Python&Java雙語代碼&#xff0c; 2025.07.07 可通過leetcode所有測試用例。 目錄 204.計數質數 解題思路 完整代碼 207.課程表 解題思…

深入理解 macOS 的 quarantine、xattr 與 Gatekeeper

在 macOS 上安裝第三方應用時&#xff0c;你是否遇到過如下提示&#xff1f; “xxx.app 已損壞&#xff0c;無法打開。”“無法打開‘xxx.app’&#xff0c;因為它來自身份不明的開發者。”“你確定要打開這個應用嗎&#xff1f;它是從互聯網下載的。” 這些提示背后&#xff0…

FastAPI學習筆記記錄

FastAPI 學習筆記 最近在公司中需要寫接口&#xff0c;選取了fastapi這個框架&#xff0c;一個原因是FastAPI 是主流框架&#xff0c;同時FastAPI 有著高性能&#xff0c;支持異步和高并發。 FastAPI 安裝 直接用下面兩行命令進行安裝 pip3 install fastapi pip install uvicor…

HTML(上)

1.web標準主要包括結構(Structure)、表現(Presentation)和行為(Behavior)三個方面。1.1 結構結構用于對網頁元素進行整理和分類&#xff0c;核心技術&#xff1a;HTML。 HTML (HyperText Markup Language)&#xff1a;超文本標記語言&#xff0c;用于定義網頁的內容和結構&…

杭州樂灣科技有限公司的背景、產品體系與技術能力的全方位深度分析

杭州樂灣科技有限公司的背景、產品體系與技術能力的全方位深度分析 文章目錄杭州樂灣科技有限公司的背景、產品體系與技術能力的全方位深度分析**一、公司背景&#xff1a;智慧養老賽道領跑者****1. 基礎信息****2. 發展里程碑****二、產品體系&#xff1a;全域智慧養老解決方案…

kettle從入門到精通 第101課 ETL之kettle DolphinScheduler調度kettle

1、下載DolphinSchedulerDolphinScheduler官網下載安裝包&#xff0c;選擇合適的版本進行下載&#xff0c;地址為https://dolphinscheduler.apache.org/zh-cn/docs/3.1.9/guide/installation/standalone2、啟動 DolphinScheduler Standalone Server我這里僅僅為了測試使用&…

微信小程序121~130

1.小程序功能開發-首頁功能 通過并發請求獲取首頁的數據。 // 導入封裝的網絡請求模塊實例 import http from ../utils/http // 定義接口api函數 export const reqIndexData () > {// 通過方式請求并獲取首頁數據&#xff0c;提升頁面渲染速度// 通過Promise.all進行并發請…

Java Stream流:高效數據處理全解析

Java Stream 流詳解 Stream 是 Java 8 引入的 API&#xff0c;用于高效處理集合數據&#xff08;如 List、Set、Map 等&#xff09;。它支持函數式編程風格&#xff0c;能實現復雜的查詢、過濾、映射等操作&#xff0c;并支持并行處理以提升性能。核心特點 非存儲數據結構&…

光子精密雙目3D線激光輪廓測量儀,擺脫視覺盲區,1臺更比2臺強!

光子精密雙目3D線激光輪廓測量儀&#xff08;GL-8160D&#xff09;&#xff0c;在GL-8000系列的基礎上創新升級。GL-8160D采用全新雙目單線設計&#xff0c;突破傳統3D視覺檢測限制&#xff0c;而且不受外部拼接標定誤差影響&#xff0c;有效消除單目盲區&#xff0c;抗光干擾能…

基于Linux驅動的可見光通信方案 —— 開源 OpenVLC 平臺入門(附 BeagleBone Black 驅動簡單解析)

60 美元玩轉 Li-Fi —— 開源 OpenVLC 平臺入門&#xff08;附 BeagleBone Black 及驅動解析&#xff09;一、什么是 OpenVLC&#xff1f; OpenVLC 是由西班牙 IMDEA Networks 研究所推出的開源可見光通信&#xff08;VLC / Li-Fi&#xff09;研究平臺。它把硬件、驅動、協議棧…

Git系列--4.Git分支設計規范

目錄 一、了解開發環境 1.1概念闡述 1.2系統概括圖 二、設計規范之GitFlow模型 2.1具體分支概念 2.1.1master 分? 2.1.2release 分? 2.1.3develop 分? 2.1.4feature 分? 2.1.5hotfix 分? 2.2宏觀表格 三、分支流程圖 一、了解開發環境 1.1概念闡述 對于開發人員…