Teams Bot自适应卡片：基于input.ChoiceSet选择结果控制字段显隐

核心逻辑是利用自适应卡片的表达式绑定功能，通过visible属性结合ChoiceSet的选中值编写判断逻辑，实现字段的动态显隐。以下是具体实现方式：

一、单选ChoiceSet场景 #

当ChoiceSet为单选模式时，选中值是字符串类型，直接通过等值判断控制显隐：

示例代码 #

{
  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
  "type": "AdaptiveCard",
  "version": "1.5",
  "body": [
    {
      "type": "Input.ChoiceSet",
      "id": "operationType",
      "label": "选择操作类型",
      "choices": [
        { "title": "填写用户信息", "value": "userInfo" },
        { "title": "填写订单信息", "value": "orderInfo" },
        { "title": "跳过", "value": "skip" }
      ],
      "style": "expanded"
    },
    // 用户信息组：仅选中"填写用户信息"时显示
    {
      "type": "Input.Text",
      "id": "userName",
      "label": "用户名",
      "visible": "${$root.operationType == 'userInfo'}"
    },
    {
      "type": "Input.Text",
      "id": "userEmail",
      "label": "邮箱地址",
      "visible": "${$root.operationType == 'userInfo'}"
    },
    // 订单信息组：仅选中"填写订单信息"时显示
    {
      "type": "Input.Text",
      "id": "orderId",
      "label": "订单ID",
      "visible": "${$root.operationType == 'orderInfo'}"
    },
    {
      "type": "Input.Date",
      "id": "orderDate",
      "label": "下单日期",
      "visible": "${$root.operationType == 'orderInfo'}"
    }
  ],
  "actions": [{ "type": "Action.Submit", "title": "提交" }]
}

二、多选ChoiceSet场景 #

当ChoiceSet开启多选模式（isMultiSelect: true），选中值是数组类型，需要用indexOf判断是否包含目标选项：

示例代码 #

{
  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
  "type": "AdaptiveCard",
  "version": "1.5",
  "body": [
    {
      "type": "Input.ChoiceSet",
      "id": "displayFields",
      "label": "选择要显示的字段组",
      "choices": [
        { "title": "联系方式", "value": "contact" },
        { "title": "收货地址", "value": "address" }
      ],
      "style": "expanded",
      "isMultiSelect": true
    },
    // 联系方式组：选中"联系方式"时显示
    {
      "type": "Container",
      "visible": "${$root.displayFields.indexOf('contact') != -1}",
      "items": [
        { "type": "Input.Text", "id": "phone", "label": "手机号" },
        { "type": "Input.Text", "id": "wechat", "label": "微信号" }
      ]
    },
    // 收货地址组：选中"收货地址"时显示
    {
      "type": "Container",
      "visible": "${$root.displayFields.indexOf('address') != -1}",
      "items": [
        { "type": "Input.Text", "id": "province", "label": "省份" },
        { "type": "Input.Text", "id": "city", "label": "城市" },
        { "type": "Input.Text", "id": "detail", "label": "详细地址" }
      ]
    }
  ],
  "actions": [{ "type": "Action.Submit", "title": "提交" }]
}

关键注意事项 #

• 卡片版本：建议使用version: 1.5及以上，确保表达式绑定功能正常（自适应卡片从1.2版本开始支持visible表达式）
• 逻辑扩展：支持组合逻辑，比如${$root.operationType == 'userInfo' || $root.operationType == 'orderInfo'}表示选中任一选项时显示
• ID对应：表达式中的$root.xxx必须与ChoiceSet的id完全一致，否则无法正确获取选中值

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