React开发NFT抽奖DApp：修复ethers合约invalid BigNumber value错误

这个错误核心原因是：传递给合约buyTicket函数的数值参数为undefined，而Solidity合约要求接收有效的BigNumber类型值。既然合约在Remix中功能正常，问题完全出在前端React的参数传递环节，以下是具体排查和修复步骤：

• 校验所有传递给buyTicket的数值参数
  调用合约前，先确认ticket数量、支付金额等参数都已正确赋值，不存在undefined的情况。比如用户输入的ticket数量是否为空，或者从合约读取的ticket价格是否未完成异步获取。

  示例校验逻辑：

  if (!selectedTicketCount || !ticketPriceWei) {
    console.error("参数缺失：ticket数量或价格未定义");
    return;
  }
  

• 确保异步获取合约参数已完成
  如果ticket价格是从合约中读取的，必须等待异步操作完成再使用，否则会拿到Promise对象而非实际数值：

  // 错误写法：未等待异步结果
  const ticketPrice = contract.ticketPrice();
  // 正确写法：await获取合约返回的BigNumber
  const ticketPrice = await contract.ticketPrice();
  

• 正确转换数值为BigNumber
  如果参数来自用户输入（比如字符串类型的数量），需要显式转换为BigNumber，且确保输入值不是空或undefined：

  // 转换用户输入的ticket数量
  const ticketCount = BigNumber.from(userInputCount);
  // 转换ETH金额为wei（如果前端用ETH展示）
  const weiAmount = ethers.utils.parseEther(userInputEthAmount);
  

• 检查合约调用的value字段
  如果buyTicket需要附带ETH支付（value参数），确认该字段的值不是undefined。比如：

  // 错误示例：value为undefined
  await contract.buyTicket(ticketCount, { value: undefined });
  // 正确示例：确保value是有效的BigNumber
  await contract.buyTicket(ticketCount, { value: ticketPriceWei });
  

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