系列文章目录


提示：写完文章后，目录可以自动生成，如何生成可参考右边的帮助文档


一、vue打印文件

1.实现

1. 下载安装插件

	npm install vue-print-nb --save

2. 引入注册

//打印文件
	import Print from 'vue-print-nb'
	Vue.use(Print)

3. html部分

	<div id="single-info">
        <el-form  label-width="160px">
           <el-row align="center" style="margin-top:30px;">
                <el-col :span="24" align="center">
                   <el-button id="info-btn" v-print="'#single-info'"  @click="prints">打印</el-button>
               </el-col>
           </el-row>
       </el-form>
    </div>

4.JS 部分

			prints(){
              var prints = document.getElementById('single-info');
              prints.title = "打印的标题";
         	}

5. v-print打印不完全问题
   
   在id中加入style=“heiht:100%”

 id="single-info" style="heiht:100%"

<style>
@media print {
  html,
  body {
    height: inherit;
  }
}
</style>

6.其他链接


ue -print – nb 打印插件 使用详解 以及连打操作 – 未采用


7.vue打印不显示时间和标题


vue 项目打印时去掉页眉页脚

<style media="print" scoped>
    @page {
      size: auto;  /* auto is the initial value */
      margin: 0mm; /* this affects the margin in the printer settings */
    }
</style>

2.其他连接

Vue实战篇十九：使用printjs打印表单

打印vue

vue实现转图片打印

html2canvas简单使用

二、二维码

1.引入二维码

二维码

2.vue复制

VUE如何实现复制功能

代码如下（示例）：

data = pd.read_csv(
    'https://labfile.oss.aliyuncs.com/courses/1283/adult.data.csv')
print(data.head())