vue 打开新窗口进行打印
父文件
let { href } = this.$router.resolve({
path: ' 自己配置本地路由,不需要动态路由 ',
query: 个人建议传一整个对象
})
window.open(href, 'newwindow', 'width=600, height=400, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no, fullscreen=yes')
子文件
若干需要打印的代码,支持vue 和 scss ,不需要纯 html 去拼接
data 创建对象
schoolForm :{} //个人建议最好和传的参数相同名字
crerte 获取
this.schoolForm = this.$route.query
setTimeout(() => {
window.print() //延迟触发,防止因传的参数速度不够快导致拿不到数据
}, 1000);
//下面这俩个方法比定时器稍微好一些,效率更快一些。 非专业测试感觉不到差距
可以挂在 mounted 里面,不需要定时器也能触发
mounted(){
this.$nextTick(()=>{ // 数据源变化了就能打印
window.print()
})
},
还可以挂在在 watch 里面
watch(){ //通过监听数据源是否发生变化进行打印
this.$nextTick(()=>{
window.print()
})
},
vue 打开新窗口进行打印的更多相关文章
- vue打开新窗口并且实现传参,有图有真相
我要实现的功能是打开一个新窗口用来展示新页面,而且需要传参数,并且参数不能显示在地址栏里面,而且当我刷新页面的时候,传过来的参数不能丢失,要一直存在,除非我手动关闭这个新窗口,即浏览器的标签页. 通过 ...
- vue 打开新窗口
const {href} = this.$router.resolve({ name: 'foo', query: { bar } }) window.open(href, '_blank')
- vue打开新窗口
1. <router-link tag="a" target="_blank" :to="{name:'detail',query:{goods ...
- vue iframe嵌套单页面时打开新窗口并自定义浏览器标题
vue打开新窗口两种写法,效果一样: 第一种: router-link 传参用query或者params都可以,tagget和tag一定要加上才可以: 第二种: 直接写成a标签就可以了. 改变浏览器窗 ...
- Post方式打开新窗口
最近在做一个跟ERP相连的领料网站,用到POST的方法打开新窗口来打印报表 代码转别人的,在这里记一下: javascript代码 function openPostWindow(url, data1 ...
- iframe嵌套vue页面打开新窗口
iframe嵌套vue页面时目录结构为下图: 此时出口文件指向index.html, 所以只需要用a标签动态拼接href, 并设置属性 target="_blank" ,即可在if ...
- ajax请求响应中用window.open打开新窗口会被浏览器拦截的解决方式
一.问题描述 ajax 异步请求成功后需要新开窗口打开 url,使用的是 window.open() 方法,但是会被浏览器给拦截了,需要用户点下. 二.问题分析 浏览器之所以拦截新开窗口是因为该操作并 ...
- javacript实现不被浏览器拦截打开新窗口
情景: 1.用户发送数据到服务器 2.服务器根据用户的数据生成文档 3.服务器把所生成的文档的下载地址提供给用户 4.用户使用的浏览器自动根据下载地址下载文件 实现: 网上搜索查找了下实现方式,就我查 ...
- 使用BOM 的window对象属性打开新窗口
★ 示例1 要求:弹出新窗口,并向新窗口写入动态HTML代码 代码 <buttononclick="btnOpen()">打开新窗口</button> & ...
随机推荐
- 第十三篇 -- QMainWindow与QAction(新建-打开-保存)
效果图: 添加了三个Action,分别是新建,打开,和保存,没有具体写相应的功能,只是提供了一个接口,可以自己写相应的功能.这次不仅将这些Action放在了工具栏,还将其添加到了菜单栏.方法同样是直接 ...
- Python基础之PyQt5关闭界面
想让执行完程序后自动关闭窗口,而不用点击右上角叉叉的方法是self.close(),具体应用还是以treewidget为例. 前面我们写了一个treewidget的界面,并且实现了界面代码分离,具体实 ...
- PhotoShop CC2015(64位)下载链接和破解教程
photoshop如今有cc和cs两种版本,之前出了一个cs的破解教程和扣圆形图,有很多朋友说cc比cs好用的多,希望出个cc的下载链接和破解教程,故推出2015pscc版破解教程和下载链接. 百度云 ...
- 【阅读笔记】Java核心技术卷一 #5.Chapter7
7 异常.断言和日志 在 Java 中,如果某个方法不能够采用正常的途径完整它的任务,就可以通过另外一个路径退出方法. 在这种情况下,将会立刻退出,并不返回任何值,而是抛出(throw)一个封装了错误 ...
- SourceTree 3.1.3版本跳过注册
1.进入文件夹 %LocalAppData%\Atlassian\SourceTree\ 找到SourceTree的目录 2.里面添加一个json文件 accounts.json 内容如下: [{&q ...
- xss常见方式
1.<script>alert(1)</script> 2.源码第一个,[<]被转义,因此在第二个里 "><script>alert(1)&l ...
- Hadoop 3.1.1 - Yarn 服务 - 快速开始
快速开始 本文描述了如何用 Yarn 服务框架在 Yarn 上部署服务. 配置和启动 HDFS 和 Yarn 组件 首先启动 HDFS 和 Yarn 的各个组件.为启用 Yarn 服务框架,添加以下参 ...
- ArrayList 源码底层实现解析 基于1.8
ArrayList 介绍 ArrayList是一种线性数据结构,它的底层是用数组实现的,是动态数组.与Java中的数组相比,它的容量能动态增长.源代码里有解释.当创建一个数组的时候,就必须确定它的大小 ...
- rsa加密初探
RSA加密算法初探 RSA加密算法是早期的非对称加密,公钥和私钥分离,公开公钥,通过确保私钥的安全来保证加密内容的安全.由麻省理工学院的罗纳德·李维斯特(Ron Rivest).阿迪·萨莫尔(Adi ...
- Android全新UI编程 - Jetpack Compose 超详细教程
1. 简介 Jetpack Compose是在2019Google i/O大会上发布的新的库.Compose库是用响应式编程的方式对View进行构建,可以用更少更直观的代码,更强大的功能,能提高开发速 ...