vue-print-nb分页打印固定表头

### 使用 `vue-print-nb` 实现分页打印并固定表头的方法

为了实现在使用 `vue-print-nb` 插件进行分页打印时保持表格头部固定的特性，可以采用如下策略：

#### 安装依赖库
首先确保安装了必要的 Vue 打印插件以及样式处理工具：

npm install vue-print-nb --save

#### HTML结构定义
创建一个具有特定类名的表格容器用于后续CSS样式的应用：

<div id="app">
  <table class="fixed-header-table" ref="printTable">
    <!-- 表格内容 -->
  </table>
</div>

#### CSS样式设置
通过自定义CSS来控制页面布局，在打印模式下使表头始终可见：

@media print {
  .fixed-header-table thead th {
    position: sticky;
    top: 0; /* 固定顶部 */
    background-color: white; /* 防止背景透明化 */
  }
}

#### JavaScript逻辑编写
引入 `vue-print-nb` 并配置好组件选项以便调用其API完成实际打印操作：

import Print from 'vue-print-nb'

export default {
  components: {Print},
  
  methods: {
    handlePrint() {
      this.$refs.printTable.style.pageBreakAfter = "always"; // 设置每一页结束后的断行方式
      this.$print(this.$refs.printTable);                    // 调用打印功能
    }
  }
}

上述代码片段展示了如何利用HTML、CSS和JavaScript相结合的方式解决这个问题[^1]。