vue3如何用 vue-print-nb实现分页打印功能

Vue3中使用vue-print-nb实现分页打印功能可以按照以下步骤进行：

1. 安装vue-print-nb

使用npm安装vue-print-nb：`npm install vue-print-nb --save`

2. 引入vue-print-nb

在需要使用的组件中引入vue-print-nb：

import Print from 'vue-print-nb'
export default {
  components: {
    Print
  },
  ...
}

3. 使用vue-print-nb

在需要实现分页打印的按钮或者链接上添加`print`指令，并传入需要打印的元素id：

<template>
  <div>
    <button v-print="'print-area'">打印</button>
    <div id="print-area">
      <!-- 需要打印的内容 -->
    </div>
  </div>
</template>

这里的`print-area`是需要打印的元素id，可以根据实际情况进行修改。

4. 修改样式

由于分页打印会将需要打印的元素按照页面进行划分，因此需要对打印样式进行修改，以保证打印效果正确。

<template>
  <div>
    <button v-print="'print-area'">打印</button>
    <div id="print-area" class="print-area">
      <!-- 需要打印的内容 -->
    </div>
  </div>
</template>

<style scoped>
@media print {
  .print-area {
    page-break-after: always;
  }
}
</style>

这里使用了`@media print`来指定打印样式，将需要打印的元素进行分页。

这样，我们就可以使用vue-print-nb在Vue3中实现分页打印功能了。