1

Vuex と Onboard.js を使用して web3 プロバイダーを DApp に保存しようとしていますがMaximum call stack size exceeded、選択したウォレットを自分の状態でコミットしようとすると、ファイルが次のようになります。

store/ethers.js

import { ethers } from 'ethers';
import Onboard from 'bnc-onboard';

export const state = () => ({
  address: '',
  onboard: null,
  wallet: null,
});

export const actions = {
  async initOnboard({ commit, state }) {
    const onboard = Onboard({
      networkId: 4,
      walletSelect: {
        wallets: [
          { walletName: 'metamask' },
        ],
      },
      subscriptions: {
        wallet: (wallet) => {
          // If I comment out this line it works...
          commit('SET_WALLET', wallet);

          localStorage.setItem('wallet', wallet.name);
        },
        address: (address) => {
          commit('SET_ADDRESS', address);
        },
      },
    });

    if (localStorage.getItem('wallet')) {
      await onboard.walletSelect(localStorage.getItem('wallet'));
    }

    commit('SET_ONBOARD', onboard);
  },
};

export const mutations = {
  SET_WALLET(state, wallet) {
    state.wallet = wallet;
  },
  SET_ONBOARD(state, onboard) {
    state.onboard = onboard;
  },
  SET_ADDRESS(state, address) {
    state.address = address;
  },
};

index.vue

<template>
  <button @click="connect">
    Connect
  </button>
</template>

<script>
import { mapActions } from 'vuex';

export default {
  mounted() {
    this.$store.dispatch('ethers/initOnboard');
  },
  methods: {
    ...mapActions('ethers', ['connect']),
  },
};
</script>

ethersライブラリを交換して同じ問題が発生したため、ライブラリの問題ではないと思いますweb3。行をコメントアウトするとcommit('SET_WALLET', wallet);エラーはなくなりますが、アプリでこれにアクセスする方法が必要です。

commits私は私の店で何か間違ったことをしていると思います.

ここに画像の説明を入力

問題を再現したリンクを次に示します。メタマスクをインストールする必要があります。「接続」ボタンをクリックして「メタマスク」を選択すると、コンソールにエラーが表示されます。

プレビュー: https://f6875.sse.codesandbox.io/

エディター: https://codesandbox.io/s/upbeat-ardinghelli-f6875?file=/pages/index.vue

4

1 に答える 1