Web3合约函数调用未按预期返回Promise但Catch功能正常求助

我帮你梳理下代码里导致“未按预期返回Promise”的核心问题，还有几个容易被忽略的bug：

1. 合约调用函数未正确返回Promise #

你的第一个requestDebenture函数虽然用了await调用合约的.send()方法，但没有返回这个异步操作的Promise，这就导致外部调用await requestDebenture(...)时，拿到的是undefined而非预期的Promise，自然无法按预期等待合约交易完成。

另外，你混用了.send()的回调函数和Promise链，还加了空的.then().catch()，这会打乱异步流程的状态传递。

2. 变量名冲突导致递归调用 #

在调用函数里，你重新声明了和合约调用函数同名的requestDebenture，这会导致函数内部调用的是自身（递归），而不是原来的合约操作函数——这是一个非常隐蔽的错误！

修复后的完整代码 #

第一步：修正合约调用函数 #

给函数换个清晰的名字，并且正确返回合约交易的Promise，同时用Web3的事件来处理交易哈希通知：

// 重命名避免变量冲突，明确这是合约调用函数
const requestDebentureContract = async (debentureAmount) => {
  createContractInstance(); // 确保这个函数正确初始化了mGenerousInstance
  // 返回合约交易的Promise，用on('transactionHash')处理哈希通知
  return mGenerousInstance.methods.requestMDebenture(
    web3.utils.toWei(debentureAmount.toString(), "ether")
  )
  .send({ from: account })
  .on('transactionHash', (txHash) => {
    if (txHash) {
      notify.hash(txHash);
    }
  });
  // 去掉空的.then().catch()，让外部统一处理成功/失败逻辑
}

第二步：修正调用函数 #

使用try/catch替代then/catch（更符合async/await的写法），并且调用正确的合约函数：

// 用独立的方法名，避免和合约函数冲突
this.handleRequestDebenture = async (e) => {
  const { debentureAmount } = this.state;
  this.setState({ debentureError: "", isInDebenture: true });

  try {
    // 调用修正后的合约函数，等待交易完成
    await requestDebentureContract(debentureAmount);
    // 交易成功后更新账户数据
    await fetchAccountBalances();
    await fetchAccountValues();
    await fetchAccountValues();
    // 更新UI状态
    this.setState({ isInDebenture: false, debentureShowing: false });
  } catch (err) {
    // 打印错误方便调试（生产环境可以去掉）
    console.error("合约请求失败:", err);
    this.setState({
      isInDebenture: false,
      debentureError: "An error has occurred while requesting for your funds"
    });
  }
}

关键修复点说明 #

• 返回Promise：合约调用函数必须返回.send()生成的Promise，这样外部的await才能正确等待交易完成。
• 避免变量名冲突：永远不要让调用函数和核心业务函数同名，否则会触发意外的递归。
• 统一异步处理风格：用async/await + try/catch替代回调和Promise链混用，代码更易读且流程清晰。
• 移除空的.then/.catch：空的处理函数会吞掉状态或错误，让调试变得困难。

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