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. PAT 甲级 1064 Complete Binary Search Tree (30 分)(不会做,重点复习,模拟中序遍历)

    1064 Complete Binary Search Tree (30 分)   A Binary Search Tree (BST) is recursively defined as a bin ...

  2. 抓取二维数组某值出来,到一维数组---array_column

    /*** * '抓取二维数组某值出来,到一维数组' * @param $arr * @param $item * @return array */ function get_arr_item_val( ...

  3. windows7 + iis7 + fastcgi + php5 + netbeans + xdebug 调试 php

    Xdebug是一个开放源代码的PHP程序调试器(即一个Debug工具),可以用来跟踪,调试和分析PHP程序的运行状况. windows7 + iis7 + fastcgi + php5 + netbe ...

  4. INTEL 7代CPU I5 7500 集显HD630 WIN7 64位

    HD630 在WIN7 下的硬件ID  (在设备管理器 - 显卡 - 属性 中查看): PCI\VEN_8086&DEV_5912&SUBSYS_D0001458&REV_04 ...

  5. SQL命令如何分发到集群的各节点

    有些数据库集群的规模是很大的,有上百个节点,那么维护SQL命令如何快速分发给各个节点,例如:要加个字段,逐个节点操作那是十分低效,枯燥的. TreeSoft增加了[SQL分发]功能,简单配置,可以快速 ...

  6. gitstats 统计gitlab仓库中的代码

    使用Git版本库,有一些可视化的工具,如gitk,giggle等,来查看项目的开发历史.但对于大型的项目,这些简单的可视化工具远远不足以了解项目完整的开发历史,一些定量的统计数据(如每日提交量,行数等 ...

  7. Docker 基础操作指南

    Docker 基础操作指南 拉取基础镜像: docker pull centos:latest 根据基础的Centos镜像运行一个名为base-centos的容器 docker run --name ...

  8. [计算机视觉][ARM-Linux开发] Ubuntu14.04安装OpenCV3.2中遇到的问题的解决方案

    2. ubuntu下,opencv3.x安装一直downloading这个包,要看超时信息里的下载路径,把它放到下载路径中,比如我的opencv3.2.0源文件路径为/home/han/softwar ...

  9. 网络爬虫基本概念与Scrapy工具包使用

    Scrapy网络爬虫 Scrapy结构图: Scrapy流动图 图 2-1 1.在D:\Workspace下新建ScrapyTest文件夹,即D:\Workspace\ScrapyTest 2.cd ...

  10. 030 Android 第三方开源下拉框:NiceSpinner的使用+自定义Button样式+shape绘制控件背景图+图片选择器(selector)

    1.NiceSpinner下拉框控件介绍 Android原生的下拉框Spinner基本上可以满足Android开发对于下拉选项的设计需求,但现在越来越流行的下拉框不满足于Android原生提供的下拉框 ...