Microsoft。Common.Grid UI 元素

Grid用户界面（UI）元素显示一组表格状的行。 行可以通过打开返回行数据的刀片来添加或编辑。

UI 示例

该 Grid 元素渲染一个带有命令按钮的表格，用于添加、编辑和删除行。

Microsoft的截图。Common.Grid UI 元素。

Schema

{
  "name": "subnets",
  "type": "Microsoft.Common.Grid",
  "label": {
    "summary": "Subnets",
    "addition": "Add subnet",
    "delete": "Delete subnet",
    "ariaLabel": "Subnets"
  },
  "defaultValue": [
    {
      "name": "default",
      "addressPrefix": "10.0.0.0/24"
    }
  ],
  "addBlade": {
    "name": "SubnetBlade",
    "extension": "Microsoft_Azure_Network",
    "parameters": {},
    "outputItem": "subnet",
    "inContextPane": true
  },
  "editBlade": {
    "name": "SubnetBlade",
    "extension": "Microsoft_Azure_Network",
    "parameters": {
      "subnet": "[$item]"
    },
    "outputItem": "subnet",
    "inContextPane": true
  },
  "constraints": {
    "rows": {
      "count": {
        "min": 1,
        "max": 5
      }
    },
    "canEditRows": true,
    "columns": [
      {
        "id": "name",
        "header": "Name",
        "cellType": "readonly",
        "text": "[$item.name]"
      },
      {
        "id": "addressPrefix",
        "header": "Address prefix",
        "cellType": "readonly",
        "text": "[$item.addressPrefix]"
      }
    ],
    "width": "Full"
  },
  "visible": true
}

示例输出

[
  {
    "name": "default",
    "addressPrefix": "10.0.0.0/24"
  }
]

Remarks

  • label.summary 用于摘要和无障碍文本。
  • label.addition 并 label.delete 提供命令标签。
  • defaultValue 是行对象数组，或是将 值计算为数组的表达式。
  • addBlade 定义了打开形成一行的锯刃。 name、 parameters和 outputItem 是必需的。
  • editBlade 定义了用于编辑现有行的刀片。 当 constraints.canEditRows 是 true时，必须这样做。
  • constraints.rows.count.min 并 constraints.rows.count.max 设定行数限制。
  • constraints.columns 定义了表格列。 一 readonly 列使用 text;一 input 列使用 element。
  • constraints.width 可以是 Small， Medium也可以 Full。
  • 对于公开模板规范表单，除非你的主机支持引用的添加和编辑刀片，否则请使用Microsoft.Common.EditableGrid。Microsoft.Common.Grid

后续步骤

  • Last updated on