如何在vueJs中不点击按钮的情况下在新标签页中打开页面

Question

I want to open the page link in a new tab after Axios response success, I have googled the solution about it but the browser keeps blocking popup. I have tried the below one but not getting work and not supported in all browsers

let newTab = window.open(); newTab.location.href = url;

Answer 1

_blank can help you opening new window. check out the documentation of window.open function on w3school. https://www.w3schools.com/jsref/met_win_open.asp

But for security reasons, browsers block such pop-ups. This is a default and desired behaviour from user security point of view. You can override this setting using below solution. https://blog.getadblock.com/how-to-disable-pop-up-blockers-in-every-browser-a1cccbae53e7

Answer 2

您可以使用_blank值将其指定为第二个参数：

let newTab = window.open(url,'_blank');

Answer 3

@Dhruti if all else fails you can still have a button click trigger the new tab, just make th button hidden and trigger a click action with JavaScript. Give the button an id or ref="somename" in Vue, and a class. Set it's opacity: 0; and position it somewhere on the page where it's unnoticed. You could even set position: relative; (or absolute/fixed) and give it a z-index: 0; or -1, and then after your axios response, call this.$refs.hiddenButton.click() making sure that you've set target="_blank" on the button.

*tip,
target="_blank" will open a new tab each time that element is clicked.
target="blank" (with no underscore) will open a new tab the first time, and then reuse that tab on each subsequent click.