Type Error：无法读取undefined的Web3Provider属性，预期输出BigNumber

这个错误的核心是你在fetchingData函数中尝试访问的Web3Provider所属对象未定义，大概率是Ethers.js导入或Provider实例化环节出了问题，以下是针对性的排查和修复步骤：

1. 确认Ethers.js的正确导入 #

确保在你的React组件文件顶部正确导入ethers库，不要使用错误的路径或遗漏导入：

import { ethers } from "ethers";

2. 保证钱包已连接且Provider实例化正确 #

在调用fetchingData前，必须确保钱包已成功连接，且基于window.ethereum正确初始化Provider：

async function fetchingData() {
  // 先检查钱包是否已注入
  if (!window.ethereum) {
    console.error("请安装MetaMask或兼容的以太坊钱包");
    return;
  }

  // 初始化Web3Provider
  try {
    const provider = new ethers.providers.Web3Provider(window.ethereum);
    // 后续逻辑：获取签名者、调用合约等
    const signer = provider.getSigner();
    const contract = new ethers.Contract(YOUR_CONTRACT_ADDRESS, YOUR_CONTRACT_ABI, signer);
    
    // 调用合约方法获取BigNumber
    const data = await contract.yourMethod();
    console.log(data); // 预期的BigNumber输出
  } catch (err) {
    console.error("数据获取失败:", err);
  }
}

3. 验证Hardhat节点与钱包网络匹配 #

确保你的钱包已切换到Hardhat本地节点网络（默认是localhost:8545），如果网络不匹配，Provider无法正常与链交互，也可能导致类似未定义的错误。

4. 检查组件状态管理（如果用状态存Provider） #

如果你的Provider是存在React状态中的，要确保状态已正确赋值后再调用fetchingData，比如用useEffect监听钱包连接状态变化，再触发数据获取：

const [provider, setProvider] = useState(null);

useEffect(() => {
  async function connectWallet() {
    if (window.ethereum) {
      const tempProvider = new ethers.providers.Web3Provider(window.ethereum);
      setProvider(tempProvider);
    }
  }
  connectWallet();
}, []);

async function fetchingData() {
  if (!provider) return; // 确保Provider存在再执行
  // 后续逻辑...
}

内容的提问来源于stack exchange，提问作者dracodes