vue页面使用js实现前端打印功能
更新时间：2024年05月11日 10:03:45 作者：jasmine0178
这篇文章主要介绍了vue页面使用js实现前端打印功能,文中通过图文结合的方式给大家讲解的非常详细,对大家实现打印功能有一定的帮助,需要的朋友可以参考下
vue页面使用js实现前端打印功能
添加打印输出按钮
printContent实现打印功能，针对于打印表单时获取不到页面数据可以使用js原生。遍历循环你所要获取的元素。
针对于打印出来的页面会出现页眉和页脚重新在写一个style
这样数据就可以渲染上去了，然后页眉页脚也没有了。这里margin的值可以自己随便更改。如果你觉得再添加一个style麻烦的话，可以在打印页面的时候取消掉页眉和页脚也是一样的。
最后想要是页面上的打印按钮隐藏，使用原生js方法让它的样式隐藏就可以了。
这样就完成啦！
到此这篇关于vue页面使用js实现前端打印功能的文章就介绍到这了,更多相关vue js前端打印内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要介绍了vue实现按需加载组件和异步组件，本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值 ,需要的朋友可以参考下2019-05-05
骨架屏就是在页面未渲染完成的时候，先用一些简单的图形大致勾勒出页面的基本轮廓，给用户带来更好的体验。这篇文章主要介绍了vue 移动端注入骨架屏,需要的朋友可以参考下2019-06-06
条件渲染是根据条件的真假来有条件地渲染元素,在Vue.js 3.x中,常见的条件渲染包括使用v-if指令和v-show指令,本文讲解使用v-if指令进行条件渲染,需要的朋友可以参考下2024-03-03
vue element中axios下载文件（后端Python）
这篇文章主要介绍了vue element中axios下载文件（后端Python）的实例代码，非常不错，具有一定的参考借鉴价值 ,需要的朋友可以参考下2019-05-05
这篇文章主要介绍了Vue单文件组件开发实现过程详解,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2020-07-07
这篇文章主要为大家详细介绍了vue使用el-upload实现文件上传功能，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-04-04
EventBus是一种发布/订阅事件设计模式的实践。这篇文章主要介绍了vue采用EventBus实现跨组件通信及注意事项,需要的朋友可以参考下2018-06-06
这篇文章主要介绍了Vue Element UI 表单自定义效验规则及使用,文中通过代码介绍了常见表单效验规则，代码简单易懂，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2023-02-02
加入购物车，是一个登录后的用户 才能进行的操作，所以需要进行鉴权判断，判断用户token是否存在，这篇文章主要介绍了Vue加入购物车判断token添加登录提示,需要的朋友可以参考下2023-11-11
element-ui 远程搜索组件el-select在项目中组件化的实现代码
这篇文章主要介绍了element-ui 远程搜索组件el-select在项目中组件化，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-12-12
最新评论