如何在Discord.js v14.2.0中实现Slash命令按钮触发新Embed

要实现点击按钮后显示新的Embed，你需要通过interactionCreate事件监听按钮交互，具体步骤如下：

1. 在主Bot文件中添加交互监听事件 #

打开你的主Bot文件（通常是index.js或main.js），添加以下代码捕获所有按钮交互：

const { MessageEmbed } = require('discord.js'); // 确保导入MessageEmbed

client.on('interactionCreate', async interaction => {
    // 只处理按钮类型的交互
    if (!interaction.isButton()) return;

    // 匹配按钮的自定义ID
    if (interaction.customId === 'exampleButton') {
        try {
            // 2. 创建点击后展示的新Embed
            const newEmbed = new MessageEmbed()
                .setColor('#FF4500')
                .setTitle('🔘 按钮触发的新内容')
                .setDescription('这是点击按钮后显示的全新Embed内容！')
                .addFields(
                    { name: '新字段1', value: '自定义内容1' },
                    { name: '新字段2', value: '自定义内容2' }
                )
                .setFooter('Powered by Nonay', interaction.member.avatarURL({ dynamic: true }));

            // 3. 响应按钮交互（两种可选方式）
            // 方式一：编辑原Slash命令的回复，替换为新Embed
            // 想保留按钮就设components为[interaction.message.components]，否则设为[]移除
            await interaction.update({ 
                embeds: [newEmbed], 
                components: [] 
            });

            // 方式二：发送仅点击者可见的临时消息
            // await interaction.reply({ embeds: [newEmbed], ephemeral: true });
        } catch (error) {
            console.error('按钮交互处理出错:', error);
            await interaction.reply({ content: '处理请求时出错了！', ephemeral: true });
        }
    }
});

额外优化：禁用按钮防止重复点击 #

如果想让按钮点击后变为不可用状态，避免重复触发，可修改update逻辑：

// 复制原按钮行并禁用按钮
const updatedRow = interaction.message.components[0];
updatedRow.components[0].setDisabled(true);

await interaction.update({ 
    embeds: [newEmbed], 
    components: [updatedRow] // 保留禁用后的按钮
});

注意事项 #

• 确保主Bot文件已正确导入MessageEmbed。
• 所有异步操作需用async/await，并通过try/catch处理错误。
• 按钮的customId必须与Slash命令中设置的完全一致（此处为exampleButton）。

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