如何在Vue.js中保存url并使用chrome外api进行chrome扩展？

我目前在开发一个简单的chrome扩展时遇到了一个奇怪的问题。 基本上，我想构建一个扩展来保存当前关注的URL。然而，似乎URL并没有保存在我定义的变量中

我尝试使用数组和变量来存储它

consoleClick() {
      var urlss = []
      var getTab = function(tab){
        urlss.push(tab)
        alert(tab)
      };
      chrome.tabs.query({'active':true}, function(tabs){
        getTab(tabs[0].url)
      });
      console.log(urlss)
      this.$store.commit('addUrl',urlss[0])
      console.log(this.$store.state.urls[0])
    }

在这里，单击按钮后，我就可以使用“chrome.tabs.query（）”获得当前关注的url。我把它保存到“urlss”，并用console.log（urlss）检查它。 我可以在控制台日志中看到url，但是，当我尝试使用urlss[0]访问url时，它说urlss[0]是“未定义的”，尽管我可以看到这一点

[]
0: "https://stackoverflow.com/posts/57089954/edit"
length: 1
__proto__: Array(0)

在日志中。这导致将“未定义”推送到我的vuex存储

我还尝试在chrome.tabs.query（）中立即将其推送到vuex存储，但它告诉我$store未定义

我知道我的解释很混乱，但我需要社区的帮助！提前感谢

可能的副本可能的副本