Как установить поставщика OpenSea.js из Onboard.js или Web3Modal.js, а затем внедрить глобально в Nuxt.js?

Question

Использование opensea-js для создания статической сгенерированной витрины с Nuxt. Поскольку провайдеры кошельков кажутся лучшими вариантами, это onboard.js или Web3modal.

Для совместного использования кода и состояния между компонентами используется «инъекция» в Nuxt. Загружен onboard.js и opensea-js как клиентский плагин.

При начальной загрузке Onboard вводится глобально. После того, как пользователь выбирает кошелек, встроенная подписка запускает функцию обратного вызова. и в его рамках становится доступным текущий провайдер. Затем я передаю поставщика OpenSeaPort и внедряю его глобально. Но это не работает, не определяется при вызове из других компонентов (страниц).

/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 = морской порт», который можно вызвать в любое время из функции обратного вызова бортовой подписки.