使用vue3-print-nb打印时,如果没使用老师的CSS样式代码,可能会出现预览和页面效果不一样,样式丢失的问题;最终发现原因是需要打印的div,在写css样式时不能被父div包裹住. 错误写法(习惯这个写): .user-info-container { .user-info-box { } } 这样写预览时样式就会丢失。 正确写法 是要分开写: .user-info-...
import Print from 'vue3-print-nb' Vue.use(Print) 使用vue-print-nb // 被打印的容器 这块内容将会被打印 // 打印按钮绑定 printObj <el-button v-print="printObj">打印</el-button> // 在数据data中添加 printObj: { id: 'printMe', // 这里是要打印元素的ID popTitle: ' ', // 打印的标...
使用vue-print-nb的API解决打印时的样式问题，通过修改CSS。对于打印不全的问题，需要通过修改源码来解决，可直接将相关文件复制到项目中的assets目录下。任意选择一个文件放入。将上述文件放置到assets目录，确保在引入时能够正确加载。在main.js中移除之前引入的vue-print-nb代码，避免冲突。在代码中添加be...
在Vue 3项目中,使用vue3-print-nb插件进行打印时,可以通过自定义CSS样式来设置打印内容的样式。以下是一些关于如何设置vue3-print-nb打印样式的详细步骤和注意事项:1. 安装vue3-print-nb插件 首先,你需要在Vue 3项目中安装vue3-print-nb插件。可以通过npm或yarn进行安装: ...
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...