Discord.js中awaitModalSubmit报错后如何禁用按钮？

问题出在你在catch回调里误用了错误的交互对象，且未正确处理原始交互的状态。当awaitModalSubmit进入catch分支（比如超时、用户未提交模态框），此时不存在submitted这个交互实例，你需要操作**最初触发模态框的那个interaction**来更新按钮状态。

解决步骤： #

1. 抽离禁用按钮的逻辑，避免重复代码
2. 在catch分支中，直接调用原始interaction的editReply方法更新组件，而非依赖submitted
3. 额外判断原始交互状态，避免不必要的报错

修改后的代码示例： #

// 抽离禁用按钮的工具函数
const disableAllButtons = (buttons) => {
  const updatedComponents = buttons.components.map(button => 
    ButtonBuilder.from(button).setDisabled(true)
  );
  return new ActionRowBuilder({ components: updatedComponents });
};

// 主逻辑
await interaction.awaitModalSubmit({
  time: 12000,
  filter: i => i.user.id === interaction.user.id,
})
.then(async (submitted) => {
  const disabledButtons = disableAllButtons(buttons);
  await submitted.update({ components: [disabledButtons] });
  await submitted.followUp({ content: 'Test' });
})
.catch(async (e) => {
  // 处理原始交互的组件更新
  const disabledButtons = disableAllButtons(buttons);
  // 无论交互是否已回复，直接编辑原始消息
  if (interaction.replied || interaction.deferred) {
    await interaction.editReply({ components: [disabledButtons] });
  }
  console.error('模态框提交超时或出错:', e);
});

关键说明： #

• 模态框超时/未提交时，submitted对象不存在，必须操作触发模态框的原始interaction
• interaction.showModal()已经完成了对原始交互的响应，后续可通过interaction.editReply()修改最初发送的消息组件
• 抽离工具函数能简化代码，避免重复编写按钮禁用逻辑

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