如何在discord.js v14中发送2个选择菜单

huangapple go评论81阅读模式
英文:

How to send 2 select menus in discord.js v14

问题

这是我的代码:

const { SlashCommandBuilder, EmbedBuilder, ButtonBuilder, ActionRowBuilder, SelectMenuBuilder } = require('discord.js');

module.exports = {
  data: new SlashCommandBuilder()
    .setName('bus-test')
    .setDescription('只是测试')
    .addAttachmentOption(option => option.setName('screenshot').setDescription('上传截图').setRequired(true))
    .addStringOption(option => option.setName('other_drivers').setDescription('输入所有驾驶员,使用 @').setRequired(true))
    .addStringOption(option => option.setName('passengers').setDescription('输入所有乘客,使用 @').setRequired(true)),
  async execute(interaction) {
    const author = interaction.user;
    const drivers = interaction.options.getString('other_drivers');
    const passengers = interaction.options.getString('passengers');
    const attachment = interaction.options.getAttachment('screenshot');
    const passengersWithDots = passengers.split(' ').map(passengers => `• ${passengers}`).join('\n');
    const driversWithDots = drivers.split(' ').map(driver => `• ${driver}`).join('\n');
    const driversWithMention = `• ${author}\n${driversWithDots}`;

    const embed = new EmbedBuilder()
      .setTitle('**报告系统规则**')
      .setColor('Yellow')
      .setDescription(`${driversWithMention}\n\n乘客\n${passengersWithDots}`)
      .setImage(attachment.url);

    const selectMenu1 = new SelectMenuBuilder()
      .setCustomId('select_menu1')
      .setPlaceholder('选择一个选项')
      .addOptions([
        {
          label: '选项 1',
          value: 'option_1',
        },
        {
          label: '选项 2',
          value: 'option_2',
        },
      ]);

    const selectMenu2 = new SelectMenuBuilder()
      .setCustomId('select_menu2')
      .setPlaceholder('选择另一个选项')
      .addOptions([
        {
          label: '选项 A',
          value: 'option_a',
        },
        {
          label: '选项 B',
          value: 'option_b',
        },
      ]);

    const button1 = new ButtonBuilder()
      .setCustomId('button1')
      .setLabel('按钮 1')
      .setStyle('Primary');

    const button2 = new ButtonBuilder()
      .setCustomId('button2')
      .setLabel('按钮 2')
      .setStyle('Danger');

    const row1 = new ActionRowBuilder()
      .addComponents(selectMenu1, selectMenu2);

    const row2 = new ActionRowBuilder()
      .addComponents(button1, button2);

    await interaction.reply({
      embeds: [embed],
      ephemeral: true,
      components: [row1, row2],
    });
  },
};

这里我尝试将选择菜单添加到操作行,然后发送它,但出现了一些错误。

错误消息:

data.components[0].components[1][COMPONENT_LAYOUT_WIDTH_EXCEEDED]: 指定的组件超出了最大宽度
at handleErrors (C:\Users\abodah\Desktop\shawarma\node_modules\@discordjs\rest\dist\index.js:640:13)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async BurstHandler.runRequest (C:\Users\abodah\Desktop\shawarma\node_modules\@discordjs\rest\dist\index.js:736:23)
at async REST.request (C:\Users\abodah\Desktop\shawarma\node_modules\@discordjs\rest\dist\index.js:1387:22)
at async ChatInputCommandInteraction.reply (C:\Users\abodah\Desktop\shawarma\node_modules\discord.js\src\structures\interfaces\InteractionResponses.js:111:5)
at async Object.execute (C:\Users\x\Desktop\shawarma\commands\bus.js:69:5)
at async Client.<anonymous> (C:\Users\x\Desktop\shawarma\bot.js:76:5) {
requestBody: { files: [], json: { type: 4, data: [Object] } },
rawError: {
message: 'Invalid Form Body',
code: 50035,
errors: { data: [Object] }
},
code: 50035,
status: 400,
method: 'POST',

有人可以帮助我并解释一下吗,请?

我想发送嵌入式菜单,然后添加两个选择菜单和两个按钮。

英文:

I am new to discord.js v14. I used to use v13 but now there is a problem with v14 I can't handle.

This is my code:

const { SlashCommandBuilder, EmbedBuilder , ButtonBuilder , ActionRowBuilder , SelectMenuBuilder} = require('discord.js');

module.exports = {
  data: new SlashCommandBuilder()
    .setName('bus-test')
    .setDescription('Just testing')
    .addAttachmentOption(option => option.setName('screenshot').setDescription('Upload a screenshot').setRequired(true))
    .addStringOption(option => option.setName('other_drivers').setDescription('Enter all drivers with @').setRequired(true))
    .addStringOption(option => option.setName('passengers').setDescription('Enter all passengers with @').setRequired(true)),
  async execute(interaction) {
    const author = interaction.user;
    const drivers = interaction.options.getString('other_drivers');
    const passengers = interaction.options.getString('passengers');
    const attachment = interaction.options.getAttachment('screenshot');
    const passengersWithDots = passengers.split(' ').map(passengers => `• ${passengers}`).join('\n');
    const driversWithDots = drivers.split(' ').map(driver => `• ${driver}`).join('\n');
    const driversWithMention = `• ${author}\n${driversWithDots}`;

    const embed = new EmbedBuilder()
      .setTitle('**Report System Rules**')
      .setColor('Yellow')
      .setDescription(`${driversWithMention}\n\nPassenger(s)\n${passengersWithDots}`)
      .setImage(attachment.url);

    const selectMenu1 = new SelectMenuBuilder()
      .setCustomId('select_menu1')
      .setPlaceholder('Select an option')
      .addOptions([
        {
          label: 'Option 1',
          value: 'option_1',
        },
        {
          label: 'Option 2',
          value: 'option_2',
        },
      ]);

    const selectMenu2 = new SelectMenuBuilder()
      .setCustomId('select_menu2')
      .setPlaceholder('Select another option')
      .addOptions([
        {
          label: 'Option A',
          value: 'option_a',
        },
        {
          label: 'Option B',
          value: 'option_b',
        },
      ]);

    const button1 = new ButtonBuilder()
      .setCustomId('button1')
      .setLabel('Button 1')
      .setStyle('Primary');

    const button2 = new ButtonBuilder()
      .setCustomId('button2')
      .setLabel('Button 2')
      .setStyle('Danger');

    const row1 = new ActionRowBuilder()
      .addComponents(selectMenu1, selectMenu2);

    const row2 = new ActionRowBuilder()
      .addComponents(button1, button2);

    await interaction.reply({
      embeds: [embed],
      ephemeral: true,
      components: [row1, row2],
    });
  },
};

Here I tried to add the select menus to the action row and then send it but it gives me some error.

The error message:

data.components[0].components[1][COMPONENT_LAYOUT_WIDTH_EXCEEDED]: The specified component exceeds the maximum width
at handleErrors (C:\Users\abodah\Desktop\shawarma\node_modules\@discordjs\rest\dist\index.js:640:13)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async BurstHandler.runRequest (C:\Users\abodah\Desktop\shawarma\node_modules\@discordjs\rest\dist\index.js:736:23)
at async REST.request (C:\Users\abodah\Desktop\shawarma\node_modules\@discordjs\rest\dist\index.js:1387:22)
at async ChatInputCommandInteraction.reply (C:\Users\abodah\Desktop\shawarma\node_modules\discord.js\src\structures\interfaces\InteractionResponses.js:111:5)
at async Object.execute (C:\Users\x\Desktop\shawarma\commands\bus.js:69:5)
at async Client.<anonymous> (C:\Users\x\Desktop\shawarma\bot.js:76:5) {
requestBody: { files: [], json: { type: 4, data: [Object] } },
rawError: {
message: 'Invalid Form Body',
code: 50035,
errors: { data: [Object] }
},
code: 50035,
status: 400,
method: 'POST',

Can someone help me and explain it to me, please?

I want to send the embed menu and then add 2 select menus to it and 2 buttons.

答案1

得分: 1

在一个操作行中无法添加多个选择菜单。如果你有多个选择菜单,每个都需要有自己的操作行。这是Discord API的限制

另一个类似的规则是,包含选择菜单的操作行不能同时包含按钮。

你可以将它们发送到不同的操作行中:

const row1 = new ActionRowBuilder().addComponents(selectMenu1);
const row2 = new ActionRowBuilder().addComponents(selectMenu2);
const row3 = new ActionRowBuilder().addComponents(button1, button2);

await interaction.reply({
  embeds: [embed],
  ephemeral: true,
  components: [row1, row2, row3],
});
英文:

There is no way to add more than one select menu in an action row. If you have more than one select menu, each one will need its own action row. This is a limitation of the Discord API.

Another similar rule is that an action row containing a select menu cannot also contain buttons.

What you can do is send them in different action rows:

const row1 = new ActionRowBuilder().addComponents(selectMenu1);
const row2 = new ActionRowBuilder().addComponents(selectMenu2);
const row3 = new ActionRowBuilder().addComponents(button1, button2);

await interaction.reply({
  embeds: [embed],
  ephemeral: true,
  components: [row1, row2, row3],
});

huangapple
  • 本文由 发表于 2023年7月13日 21:31:33
  • 转载请务必保留本文链接:https://go.coder-hub.com/76679934.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定