WalletBalance.tsx 代币余额 Returns ：未定义

Question

我已经完成了全栈 defi 课程，当我使用 usedapp/core 中的 useTokenBalance 函数时，我什么也没得到返回，我不知道哪里出错了，因为我已经当我 console.log 地址和帐户变量时，它 returns 具有正确的帐户地址和正确的令牌地址。

这是打字稿：

import {useEthers, useTokenBalance} from "@usedapp/core"
import {formatUnits} from "@ethersproject/units"

export interface WalletBalanceProps {
    token: Token
}

export const WalletBalance = ({token}: WalletBalanceProps) => {
    const {image, address, name} = token
    const {account} = useEthers()
    console.log(account)
    console.log(address)
    const tokenBalance = useTokenBalance(address, account)
    const formattedTokenBalance: number = tokenBalance ? parseFloat(formatUnits(tokenBalance, 18)) : 0
    console.log(tokenBalance?.toString())
    return (<div>{formattedTokenBalance}</div>)
}

我认为这可能是@usedapp/core 的错误，但我重新安装了@usedapp/core，但我仍然收到相同的错误。任何帮助都会有用:)

Answer 1

我有完全相同的问题。 console.log returns 正确的令牌和帐户地址，useTokenBalance() returns 未定义。

Answer 2

您应该尝试更改 App.tsx

中的配置设置

import { DAppProvider, Config, Kovan } from "@usedapp/core"
import { Header } from "./components/Header";
import Container from "@mui/material/Container"
import { Main } from "./components/Main";
import { getDefaultProvider } from 'ethers'


const config: Config = {
  readOnlyChainId: Kovan.chainId,
  readOnlyUrls: {
    [Kovan.chainId]: getDefaultProvider('kovan'),
  },
}

function App() {
  return (
    <DAppProvider config={config} >
      <Header></Header>
      <Container maxWidth="md">
        <div className="App">
          <Main />
        </div>
      </Container>
    </DAppProvider>
  );
}

export default App;

WalletBalance.tsx 代币余额 Returns ：未定义

WalletBalance.tsx Token Balance Returns : undefined

typescript

solidity

brownie

usedapp