Discord.js中interaction.editReply与MessageComponentCollector配合失效问题

问题场景 #

用Discord.js开发机器人商品筛选命令，生成最多10个Embed展示在售商品，超过10件时用按钮切换上下分组。点击按钮希望更新初始消息而非发新消息，但触发错误：

Error [InteractionNotReplied]: The reply to this interaction has not been sent or deferred.

错误原因 #

核心问题是collect事件回调里的interaction参数和外层命令的interaction重名，导致内部代码错误地使用了命令交互对象而非按钮交互对象。另外，组件交互应该用update()方法而非editReply()——editReply()是用来修改命令的初始回复，而按钮这类组件交互需要用update()来更新挂载组件的消息。

修正后的代码 #

// 初始命令回复
const reply = await interaction.reply({
  embeds: embedsToDisplay,
  components: [buttonRow],
  ephemeral: true,
});

const collector = reply.createMessageComponentCollector({
  componentType: ComponentType.Button,
});

// 重命名交互参数为buttonInteraction，避免和外层重名
collector.on("collect", async (buttonInteraction) => {
  if (buttonInteraction.customId === "seeNext10Items") {
    counterOfItemTenLowerRange++;
    counterOfItemTenUpperRange++;
    seePrevious10Items.setDisabled(false);
    
    embedsToDisplay = result
      .slice(
        counterOfItemTenLowerRange * 10,
        counterOfItemTenUpperRange * 10
      )
      .map((item) => embedCreator.createEmbedResponseFilterHdv(item));

    if (counterOfItemTenUpperRange === numberOfItemDividedByTen) {
      seeNext10Items.setDisabled(true);
    }

    // 用update()更新组件所在的消息
    await buttonInteraction.update({
      embeds: embedsToDisplay,
      components: [buttonRow],
    });
    return;
  }
  
  if (buttonInteraction.customId === "seePrevious10Items") {
    counterOfItemTenLowerRange--;
    counterOfItemTenUpperRange--;
    seeNext10Items.setDisabled(false);
    
    embedsToDisplay = result
      .slice(
        counterOfItemTenLowerRange * 10,
        counterOfItemTenUpperRange * 10
      )
      .map((item) => embedCreator.createEmbedResponseFilterHdv(item));

    if (counterOfItemTenLowerRange === 0) {
      seePrevious10Items.setDisabled(true);
    }

    await buttonInteraction.update({
      embeds: embedsToDisplay,
      components: [buttonRow],
    });
    return;
  }
});

关键改动说明 #

• 把collect事件里的参数从interaction改成buttonInteraction，避免变量名冲突，确保操作的是按钮的交互实例
• 将editReply()替换为update()，这是Discord.js中组件交互更新消息的正确方法
• 移除update()里的ephemeral参数——ephemeral只在初始回复时设置，后续更新不需要重复指定

内容的提问来源于stack exchange，提问作者Alex.A