如何从Onboard.js或Web3Modal.js中设置Onboard.js提供程序，然后在Nuxt.js中全局注入？

Question

使用opensea构建静态生成的店面。因为钱包提供商似乎是最好的选择是onboard.js或Web3modal。

在Nuxt中使用"inject“的组件之间共享代码和状态。将onboard.js和opensea作为客户端插件加载。

在初始载荷下，在全球范围内注入。用户选择钱包后，车载订阅会触发一个回调函数wallet: (wallet) => {...}，并且在其作用范围内，当前提供程序变得可用。然后，我将提供程序传递给OpenSeaPort，并将其全局注入。但是它不起作用，当从其他组件(页面)调用时，this.$seaport不会被定义。

/plugins/onboardopensea.client.js

import { OpenSeaPort, Network } from "opensea-js";
import Onboard from "bnc-onboard";

export default ({ app }, inject) => {

  let seaport = {};

  const onboard = Onboard({
    dappId: "...",
    networkId: 1,
    subscriptions: {
      wallet: (wallet) => {

      seaport = new OpenSeaPort(wallet.provider, {
      networkName: Network.Main,
      apiKey: "...",
       });

      inject("seaport", seaport);
      },
    },
    walletSelect: {
      wallets: ...,
    },
)};

  inject("onboard", onboard);
}

似乎注入函数只运行一次，第一次加载，并在稍后从车载钱包回调函数调用时运行。

Answer 1

经过更深入的研究，"Inject“似乎只被调用了一次，并附加到Vue实例和Nuxt应用程序。使用"Vue.prototype.$seaport = seaport“，它可以在任何时候从车载订阅回调函数调用。