vue3-print-nb打印后面一直有个空白页？

Question

打印下面总有一个空白的页面，有人遇到过没？

const printObj = {
  id: 'printContent',
  //preview: true,
  popTitle: '.',
  prevTitle: 'sss',
  zIndex: 20003,
  beforeOpenCallback(vue) {
    vue.printLoading = true
  }
}
</script>

<template>
  <div class="flex-col justify-center" id="printContent">
    <div class="text-center text-xl m-4">底单</div>
    <div class="flex justify-around m-15px">
      <div>{{ props.info.PName }}</div>
      <div>{{ props.info.StuffTime }}</div>
      <div>{{ props.list[0].InputDoctor }}</div>
      <div>{{ props.list[0].StuffDoctor }}</div>
    </div>
    <div class="bgxhs" v-html="props.info.GeneralExam"></div>
    <Table :columns="columns" :data="tableDataList" />
  </div>
  <div class="flex justify-center m-t-5"><BaseButton v-print="printObj">打印</BaseButton></div>
</template>

<style scoped lang="less">
.bgxhs {
  background: #efeff0;
  min-height: 220px;
  padding: 0.5rem;
  margin: 1rem auto;
}
:deep(table) {
  table-layout: auto !important;
}
:deep(.el-table__header-wrapper .el-table__header) {
  width: 100% !important;
}
:deep(.el-table__body-wrapper .el-table__body) {
  width: 100% !important;
}
:deep(.el-table .cell.el-tooltip) {
  text-overflow: clip;
  white-space: normal;
  min-width: none;
  width: auto !important;
  border: none !important;
}
</style>
<style media="print">
@media print {
  html,
  body {
    overflow: unset !important;
  }
}
</style>

Answer 1

主要是设置html的样式：

html {
    margin: 0px;
    height: auto;
}
body {
    border: solid 1px white;
    margin: 10mm 15mm 10mm 15mm;
}