新 url 未在新标签页中打开

Question

我有这个代码：

<b-btn
   variant="primary"
   class="btn-sm"
   :disabled="updatePending || !row.enabled"
   @click="changeState(row, row.dt ? 'activate' : 'start')">
   Activate
 </b-btn>

 ...........
 methods: {
    async changeState(channel, newMode) {
      const { id, type } = channel;
      const data = await this.getToken();
      window.open("https://en.wikipedia.org/", "_blank");
      return;
 }

当点击按钮时，没有打开新标签页。

问题与 await this.getToken() 有关。如果我删除代码，一切正常。

Answer 1

如果它在没有 const data = await this.getToken(); 的情况下也能正常工作，那么问题是浏览器阻止了它，因为它显然不是点击的结果（而且浏览器往往不喜欢意外的弹出窗口）。

可能有用的（至少它在 firefox 上有用）是做类似的事情：

async changeState(channel, newMode) {
  let w = window.open("", "_blank");
  const { id, type } = channel;
  const data = await this.getToken();
  w.location.href = "https://en.wikipedia.org/"
  return;
}

首先打开新的window，然后更改新打开的window的URL。

例如https://jsfiddle.net/xgoavep2/

新 url 未在新标签页中打开

New url is not opened in a new tab

javascript

vue.js

vuejs2