在vue-print-nb中实现页码功能,主要依赖于CSS的@page规则以及插件提供的extraHead选项。通过这两个工具,你可以定义打印时的页面布局和页码样式。 3. vue-print-nb页码设置的示例代码 下面是一个使用vue-print-nb设置页码的示例代码: vue <template> <div> <!-- 打印按钮 --> <butt...
import Vue from 'vue' import Print from 'vue-print-nb' Vue.use(Print) 1. 2. 3. 4. 5. 6. 第三步、代码编写 打印参数说明 id: "printDomId", // 需要打印的容器ID extraCss: "", // 打印时引入一个css文件 popTitle: " ", // 打印的页眉标题,默认浏览器标题 空字符串时显示undefined ...
简介: vue 打印vue-print-nb 安装配置 npm install vue-print-nb --save main.js中 // 导入打印插件 import Print from 'vue-print-nb' Vue.use(Print); .vue页面中使用 打印内容 <el-button type="primary" v-print="'printConfig'">打印</el-button> data中定义变量 printConfig:{ id:'print...
当前示例以Vue3+ElementPlus为例,如果要使用vue2版本的就安装npm install vue-print-nb --save。 npm install vue3-print-nb --save import { createApp } from 'vue' import ElementPlus from 'element-plus' import 'element-plus/dist/index.css' import print from 'vue3-print-nb' import './style....
1.引入插件 npm install vue-print-nb --save 在main.js中引入 import Print from 'vue-print-nb' Vue.use(Print) 2.html代码 木材检尺报告书船名{{ goods.shipName }}输出国{{ goods.exportCountry }}树种{{ variety }}委托方/货主{{ goods.goodsMaster }}<...
一、安装vue3-print-nb npm install vue3-print-nb--save yarn add vue3-print-nb 1. 2. 二、引入Vue项目 // 1. 全局挂载import{createApp}from'vue'importAppfrom './App.vue'importprintfrom 'vue3-print-nb'constapp=createApp(App)app.use(print)app.mount('#app')// 2. 自定义指令importprin...
也可以将vue-print-nb源码放到项目中,即print里面的代码 如: 只是要改动一下,vue3自定义指令和vue2自定义指令不太一样,将print.js中的 bind(el, binding, vnode) {} 函数修改为 mounted: (el, binding, vnode) => {}, 去掉vue.$nextTick, 还要注意替换main.js文件里的print引用文件地址 就可以使用了...
基于vue3-print-np 改造的 vue 打印库,使用 Typescript 重构,对 vue3 setup 有更好的支持,支持手动调用打印函数等。 printtypescirptvue-print-nbvue-printvue3-print UpdatedJan 2, 2025 TypeScript Vue plug-in, print! Good! vue-print-nbvue-print-nb-jeecg ...
(1)把vue-print-nb的文件夹放到自己的文件夹中,在src 下新建utils文件 里面放入src 和index.js src里面是print.js 和printarea.js index.js和print.js是自定义指令有关的,我们需要的只是printarea.js main.js里面修改成如下 代码语言:javascript 代码运行次数:0 复制Cloud Studio 代码运行 //import Print from ...
npm install vue-print-nb --save importPrintfrom'vue-print-nb'// Global instructionVue.use(Print);//or// Local instructionimportprintfrom'vue-print-nb'directives: { print } Run demo Download the project, install dependencies, run demo