1、https://github.com/xyl66/vuePlugs_printjs从这个路径下载print.js。放到你的代码中

2、我是放到我本地一个js文件中。

3、引入当前文件

//打印插件
import Print from './utils/print'
Vue.use(Print) // 注册

4、页面应用

<template>
<section ref="print" style="max-height: 1000px;width: 800px;margin: 0 auto;">
<p>我的打印的内容</p>
</section>
</template> <script>
this.$print(this.$refs.print)
</script>

把需要打印的东西放入这个标签中就可以了。

当内容中有不需要打印的东西时可以这样

<p class="no-print">不要打印</p>

vue 打印html的更多相关文章

  1. vue打印html

    # vue打印功能 console.log(data.doPrint); // html字符串 let newContent =data.doPrint; let oldContent = docum ...

  2. vue 打印页面部分区域

    1. vue项目打印页面部分区域 2. 原生js实现页面局部打印功能 3. vue项目中将table组件导出Excel表格以及打印页面内容

  3. vue 打印

    vue 方法 第一种方法:通过npm 安装插件 1,安装  npm install vue-print-nb --save 2,引入  安装好以后在main.js文件中引入  import Print ...

  4. vue 打印功能

    printContent (e) { let subOutputRankPrint = document.getElementById('subOutputRank-print') console.l ...

  5. VUE—打印(原生态网页打印)

    //打印触发的方法 print(e){ let subOutputRankPrin = document.getElementById('printcode'); var options = { fo ...

  6. Vue 打印预览功能

    需求有几种情况: 1.直接在HTML写页面,将页面上的东西用A4纸打印出来: 2.后台传回PDF文件,前台浏览器预览并打印: 3.后台做好要打印的,传回图片,如base64编码,前台浏览器 预览并打印 ...

  7. vue 打印 页面特定部分转pdf

    https://www.jb51.net/article/147040.htm https://www.jianshu.com/p/dd120b65446a  //转pdf

  8. 使用那各VUE的打印功能(print.js)出现多打印一个空白页的问题

    最近这段时间,用VUE写东西,有个打印功能. 百度了一下,铺天盖地的VUE打印的两种实现方法. 很感激这些千篇一律的帖子,虽然不知道他们是否真的用过,还是只是复制粘贴. 至少这些帖子告诉我,是有两个可 ...

  9. 深入理解vue

    一 理解vue的核心理念 使用vue会让人感到身心愉悦,它同时具备angular和react的优点,轻量级,api简单,文档齐全,简单强大,麻雀虽小五脏俱全. 倘若用一句话来概括vue,那么我首先想到 ...

随机推荐

  1. [转]动态规划DP的分类

    链接地址:http://www.cnblogs.com/Renyi-Fan/p/9285495.html

  2. JS和vue文本框输入改变p标签的内容测试

    文本框输入,p标签的内容自动变成文本框的内容,如下是三种方法的测试: 方法1:JS里的onchange,当文本框内容改变事件,该事件里写的方法是,获取p标签本身,然后获取文本框的值,赋值给变量,最后给 ...

  3. vue-cli3 按需加载loading,服务的方式调用

    安装 babel-plugin-component npm install babel-plugin-component -S 安装element-ui npm install element-ui ...

  4. FastDFS配置详解之Storage配置

    1 基本配置disabled #func:该配置文件是否生效#valu:## true:无效## false:生效disabled=false group_name#func:本storage ser ...

  5. Python3之调试

    程序能一次写完并正常运行的概率很小,基本不超过1%.总会有各种各样的bug需要修正.有的bug很简单,看看错误信息就知道,有的bug很复杂,我们需要知道出错时,哪些变量的值是正确的,哪些变量的值是错误 ...

  6. JMC(Java Mission Control)在mac下无法启动和显示界面

    错误 `org.eclipse.swt.layout.griddata cannot be cast to org.eclipse.swt.layout.filldata` 解决 来源 注意 根据自己 ...

  7. PHP中的重载技术

    PHP中的重载技术 通常面向对象语言的重载技术 其基本语法是这样的: 在一个类中,有多个同名的方法,每个方法的参数不同而已.这种现象就称为“重载”. 参数不同可以是:数量个数不同,或类型不同,或顺序不 ...

  8. HashMap的key存储对象需要注意哪些

    HashMap的key最好不要存储对象,大部分环境都是String. 如果要存储对象,要注意重写下equal和hashcode方法!!

  9. Asp.Net Core中完成拒绝访问功能

    很多时候如果用户没有某个菜单的操作权限的话在页面是不应该显示出来的. @if (SignInManager.IsSignedIn(User) && User.IsInRole(&quo ...

  10. Android持久化存储——(包含操作SQLite数据库)

    <第一行代码>读书手札 你可能会遇到的问题:解决File Explorer 中无显示问题 Android中,持久化存储,常见的一共有三种方法实现 (一.)利用文件存储 文件存储是Andro ...