vue项目中解决打开新页浏览器拦截的问题

项目中，如果通过接口获取数据，并在then中打开新页面会提示浏览器阻止，如何解决呢？

其实很简单：

1.定义一个url

data(){return{url:''}
}

2.监听该url,url发生变化时打开新窗口

 watch:{newWin(){if(this.url){window.open(this.url,'_blank')}this.url=''}}

3.在接口处理中给url赋值

getData().then(res=>{...this.url=res.data.url
})

这样，在打开新窗口的时候，浏览器就不会拦截了。

vue项目中解决打开新页浏览器拦截的问题相关推荐

vue项目中解决浏览器刷新vuex数据消失问题
vue项目中解决浏览器刷新vuex数据消失问题说明 vuex中的数据经过浏览器刷新后会消失,所以应设置在浏览器刷新之前将数据存入浏览器或者cookie中. 操作打开App.vue,在created ...
pdf预览在vue项目中的使用兼容ie浏览器
最近做项目有需求需要pdf在线预览并支持下载,而且还要兼容ie浏览器,之前又是使用过vue-pdf插件在chrome上没有问题但是在ie上不兼容.最后使用了pdf.Js这个原生库,虽然网上有许多使用教 ...
vue解决打开新窗口被拦截的的实战方法
解决方案: 1. 使用a标签替代给出如下函数,将此函数绑定到click的事件回调中,就可以避免大部分浏览器对窗口弹出的拦截. newLink(url) {let a = document.creat ...
前端开发：Vue项目中解决Emitted value instead of an instance of Error问题
分享一个在刚接触前端开发的开发者常遇到的一个经典错误,那就是在Vue项目运行中遇到Emitted value instead of an instance of Error的问题,附带解决该问题的方法 ...
vue项目中解决谷歌浏览器默认填充账号密码问题
谷歌浏览器第一次登录保存账号密码之后,后续在碰到需要输入账号密码时,浏览器会默认填充账号密码. 项目是vue + element-ui搭建的后台管理系统,不想要账号密码默认填充的效果该怎么办呢? 直接 ...
vue项目中解决路由重复点击报错问题
router.js中写入 import导入代码下面加入const prototypePush = VueRouter.prototype.pushVueRouter.prototype.push = ...
vue点击按钮打开新页签，并传参
<div @click="btn">跳转 </div>btn() {let routeData = _this.$router.resolve({ path ...
vue项目中阻止浏览器返回上一页
vue项目中在某个页面阻止浏览器返回上一页,适用移动端.PC端. 使用场景例如: 首页与 A页面来回跳转,那样点击浏览器返回时也会来回跳转,本想当页面在首页的时候就不再返回了,所以这个时候 ...
vue项目中浏览器图标的设置
在vue项目中,我们怎样设置浏览器图标? 我们来看vue项目的目录结构,根目录下有一个index.html,这个就相当于我们普通项目中的各个html页面文件,所以设置方法就是在index.html的h ...

vue项目中解决打开新页浏览器拦截的问题

vue项目中解决打开新页浏览器拦截的问题相关推荐

最新文章

热门文章