单击 Slack 应用程序上的按钮时如何获取字段值？

Question

我研究了 Slack Bolt Framework，并创建了一个非常简单的应用程序，可以使用斜杠命令。当我键入“/cep”时，会出现以下屏幕：

printscreen

点击按钮时如何获取输入值字段？

我在 Javascript 中使用 Bolt 框架。

这里是屏幕代码：

/ Listen for a slash command invocation 'Busca de CEP'
app.command('/cep', async ({ command, ack, say }) => {
  
  // Acknowledge the command request
  await ack();
  
  await say(
    {
        "blocks": [
            {
                "type": "header",
                "text": {
                    "type": "plain_text",
                    "text": " Busca de Endereço",
                    "emoji": true
                }
            },
            {
                "type": "divider"
            },
            {
                "type": "section",
                "text": {
                    "type": "plain_text",
                    "text": "Digite o CEP que deseja pesquisar:",
                    "emoji": true
                }
            },
            {
                "type": "input",
                "element": {
                    "type": "plain_text_input",
                    "action_id": "plain_text_input-action"
                },
                "label": {
                    "type": "plain_text",
                    "text": " ",
                    "emoji": true
                }
            },
            {
                "type": "actions",
                "elements": [
                    {
                        "type": "button",
                        "text": {
                            "type": "plain_text",
                            "text": "Buscar",
                            "emoji": true
                        },
                        "value": "submitCEPButton",
                        "action_id": "submitCEPButton"
                    }
                ]
            }
        ]
    }
  )
  
});

这里是斜杠命令代码：

/ Action listener function called when an interactive component with action_id of “click_me_button” is triggered
app.action('submitCEPButton', async ({ ack, body, client, say }) => {
  // Acknowledge action request before anything else
  await ack();
  
  let channelID = body.channel.id
  let userID = body.user.id
  
  // Respond to action with an ephemeral message
  await client.chat.postEphemeral({
    channel: channelID,
    user: userID,
    text: `<@${userID}> clicked the button! `
  });
});

更新

当我输入斜杠命令 '/cep' 时的屏幕代码

app.command('/cep', async ({ command, ack, say }) => {
  
  // Acknowledge the command request
  await ack();
  
  await say(
    {
        "blocks": [
            {
                "type": "header",
                "block_id": "headerBlock",
                "text": {
                    "type": "plain_text",
                    "text": " Busca de Endereço",
                    "emoji": true
                }
            },
            {
                "type": "divider",
                "block_id": "dividerBlock",
            },
            {
                "type": "section",
                "block_id": "sectionBlock",
                "text": {
                    "type": "plain_text",
                    "text": "Digite o CEP que deseja pesquisar:",
                    "emoji": true
                }
            },
            {
                "type": "input",
                "block_id": "inputBlock",
                "element": {
                    "type": "plain_text_input",
                    "action_id": "inputCEP"
                },
                "label": {
                    "type": "plain_text",
                    "text": " ",
                    "emoji": false
                }
            },
            {
                "type": "actions",
                "block_id": "submitBlock",
                "elements": [
                    {
                        "type": "button",
                        "text": {
                            "type": "plain_text",
                            "text": "Buscar",
                            "emoji": true
                        },
                        "value": "submitCEPButton",
                        "action_id": "submitCEPButton"
                    }
                ]
            }
        ]
    }
  )
  
});

点击按钮时的指令

// Action listener function called when an interactive component with action_id of “click_me_button” is triggered
app.action('submitCEPButton', async ({ ack, body, client, say }) => {
  // Acknowledge action request before anything else
  await ack();
  
  let channelID = body.channel.id
  let userID = body.user.id
  console.log(body.state.values)
});

控制台打印的结果：

{
  njQfY: {
    'plain_text_input-action': { type: 'plain_text_input', value: 'abc123' }
  }
}

Answer 1

您需要从 view_submission 负载中 view.state.values。

参考：https://api.slack.com/reference/interaction-payloads/views

您需要专注于 block_id 和 action_id，因为这可能很棘手。

单击 Slack 应用程序上的按钮时如何获取字段值？

How to get the field value when clicking on a button on a Slack app?

javascript

slack

slack-api

slack-block-kit