Vue中的v-print打印不完全问题

打印一个有很多table的页面，预览的时候发现页面会缺失后面的一部分，如何解决？打印页面用的是v-print<el-button type="danger" class="no-print" round v-print="'#printDiv'"> 打印 </el-button>给要打印的区域加上id仅仅这样写会出现打印不完全需要给打印区域加上样式<style>

哪有人敲代码不戴头盔的

3864人浏览 · 2021-03-10 11:45:51

哪有人敲代码不戴头盔的 · 2021-03-10 11:45:51 发布

打印一个有很多table的页面，预览的时候发现页面会缺失后面的一部分，如何解决？
打印页面用的是v-print

<el-button type="danger" class="no-print" round v-print="'#printDiv'"> 打印 </el-button>

给要打印的区域加上id
在这里插入图片描述
仅仅这样写会出现打印不完全
需要给打印区域加上样式

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

然后就可以打印完全了

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^