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. Top 10 Machine Learning Algorithms For Beginners

    Linear Regression Logistic regression KNN Classification Support Vector Machine (SVM) Decision Trees ...

  2. 如何修改WAMPServer默认的网站路径地址

    通常,我们安装WAMPServer集成的PHP开发环境之后,默认的网站路径地址是其安装目录下子文件夹:"wamp/www/".那么我们怎么修改网站地址到自己指定的路径呢?本篇经验将 ...

  3. angular2 select 联动

    界面操作触发大分类id改变,根据id获取二级分类的数据进行绑定显示. html: <div style="overflow: hidden;float: left;padding-le ...

  4. C# .NET WINFORM MUTEX 互斥

    static class Program 里的全局变量: static System.Threading.Mutex appMutex; Main 方法里的内容: string exeName = & ...

  5. RobotFramework:查询条件为最近一个月的数据(2019-07-09 00:00:00.000 到 2019-08-07 23:59:59.999)

    自动化测试中遇到,默认查询条件为最近一个月,所以起始时间就应该为(2019-07-09 00:00:00.000 到  2019-08-07 23:59:59.999) test ${current_ ...

  6. [BJOI2019] 删数 [dp转贪心结论+线段树]

    题面 传送门 思路 dp部分 以下称合法序列为原题面中可以删空的序列 这个是我在模拟考场上的思路 一开始我是觉得,这个首先可以写成一个dp的形式:$dp[i][j]$表示用$j$个数字填满了目标序列的 ...

  7. 一个栈的入栈序列为ABCDEF,则不可能的出栈序列是

    技术之瞳 阿里巴巴技术笔试心得习题2.65:  一个栈的入栈序列为ABCDEF,则不可能的出栈序列是(D)  A.DEFCBA B.DCEFBA C.FEDCBA  D.FECDBA E.ABCDEF ...

  8. PHP中文名加密

    <?php function encryptName($name) { $encrypt_name = ''; //判断是否包含中文字符 if(preg_match("/[\x{4e0 ...

  9. 判断List集合为空还是null的正确打开方式

    事故场景还原 最近在写一个项目的时候遇到一个这样一个问题,我简单的还原一下场景,这是模拟一个简单的管理系统 ① 一张简单的客户表 CREATE TABLE customer( id INT(11) N ...

  10. 022 Android .9图片的含义及制作教程

    1.图片(.9.png格式)的概念 (1)9patch图片是andriod app开发里一种特殊的图片形式,文件的扩展名为:.9.png (2)9patch图片的作用就是在图片拉伸的时候保证其不会失真 ...