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. Python - Django - 组件

    网站中通常会有一个导航条,如下图 这个导航条在很多页面都会存在 可以把导航条做成一个组件,让要显示导航条的网页包含 导航条组件 nav.html: <h1>假装这是一个导航条</h1 ...

  2. redis和memcache对比

    1.性能方面:没有必要过多的关心性能,因为二者的性能都已经足够高了.由于Redis只使用单核,而Memcached可以使用多核,所以在比较上,平均每一个核上Redis在存储小数据时比Memcached ...

  3. Swift4.0复习访问控制与作用域

    1.访问等级: open: 可以继承,可以重写. public: “public 访问等级能用于修饰所有文件作用域的函数.对象.协议.枚举.结构体.类以及各种类型中的属性与方法.用 public 所修 ...

  4. Docker学习笔记——1.2 Docker组件

    Docker的核心组件包括: Docker客户端和服务器,也称为Docker引擎: Docker镜像: Registry: Docker容器. 1.Docker客户端和服务器 Docker是一个客户端 ...

  5. 【Leetcode_easy】836. Rectangle Overlap

    problem 836. Rectangle Overlap solution: class Solution { public: bool isRectangleOverlap(vector< ...

  6. ECOC 2019展会:以太网联盟公开展示其下一代网络100/200/400G互通测试能力,网络自动化测试能力再次被提出

    欧洲光纤通讯展ECOC 2019正在火热进行,以太网联盟组织Ethernet Alliance在其公开展台演示了其下一代高速网络100G/200G/400G相关能力,其成员单位Cisco,Arista ...

  7. 【GStreamer开发】GStreamer播放教程07——自定义playbin2的sink

    目标 通过手动选择音频和视频的sink,playbin2可以进一步定制.这允许使用playbin2的应用在解码后可以自行做最终的渲染和显示.本教程展示了: 如何替换playbin2选择的sink 如何 ...

  8. rsync同步本地和服务器之间的文件

    同步本地文件到服务器 rsync -zvrtopg --progress --delete test -e 'ssh -p 6665' yueyao@172.16.0.99:/media/sdb/us ...

  9. LeetCode 230. 二叉搜索树中第K小的元素(Kth Smallest Element in a BST)

    230. 二叉搜索树中第K小的元素 230. Kth Smallest Element in a BST 题目描述 给定一个二叉搜索树,编写一个函数 kthSmallest 来查找其中第 k 个最小的 ...

  10. STM32之外部中断

    图1.0 图1.1 中断控制器支持23条中断线,其中16条是IO管脚中断线,分别是EXTI0~EXTI15:  图 1.2 另外七根中断线如下图: 中断线和管脚的对应关系:EXTI0~EXTI15 和 ...