小编alf*_*un0的帖子

我在简单的 chrome 扩展中收到此错误。我正在尝试将一些消息从 background.js 传递到我的内容脚本。第一条消息将毫无问题地发送，但第二条消息给我这个错误_generated_background_page.html:1 Unchecked runtime.lastError: The message port closed before a response was received.

我需要在收到第一条消息后传递内容脚本的响应，这是因为我需要从中删除事件侦听器，webRequest.onCompleted否则我将遇到消息传递的循环问题。我不确定我是否在removeListener功能上也做得很好。

这是我的代码，任何帮助将不胜感激

内容脚本.js

const m3u8 = new M3U8(); 
console.log(m3u8);
chrome.runtime.onMessage.addListener( message => {    
    console.log(message);
    chrome.runtime.sendMessage({status: 'ok'})
    const download = m3u8.start(message.url);
    download.on("progress", progress => {
        console.log(progress);
    }).on("finished", finished => {
        console.log(finished);
    }).on("error", error => {
        console.log(error);
    });
});

背景.js

const sendURL = (request) => {
    chrome.tabs.sendMessage(request.tabId, {url: request.url}, response => {
        if( response.status === 'ok' ){
            chrome.webRequest.onCompleted.removeListener( sendURL )
        } …

我在 vue 项目中使用 bootstrap 5。我创建了一个组件，它有两个导航选项卡来显示一些内容，如果用户执行操作，我需要显示第二个选项卡。我使用数据属性来触发普通选项卡可视化，但我想在用户操作后以编程方式显示第二个选项卡。谁能帮我？我尝试过这段代码但没有成功

    <nav class="nav mt-2 mb-2" role="tablist">
      <a class="nav-link active p-0 pr-2" role="tab" href="#program-tab" data-toggle="tab">Info</a>
      <a class="nav-link p-0 pr-2" role="tab" href="#download-tab" data-toggle="tab">Downloads</a>
    </nav>

<div class="row tab-pane fade m-0" id="download-tab" role="tabpanel" ref="downloadTab">...</div>

import { Tab } from 'bootstrap/dist/js/bootstrap.min.js'

data() {
  return {
    tab: null
  }
},
methods: {
  openTab() {
    this.tab = new Tab()
    console.log(this.tab)
    this.tab.getInstance(this.$refs.downloadTab).show()
  }
}