Поделиться через

Добавление действия меню

  • Статья

Azure DevOps Services | Azure DevOps Server 2022 — Azure DevOps Server 2019

В этом примере мы добавим действие в контекстное меню запроса в центре запросов рабочих элементов.

Совет

Ознакомьтесь с нашей новой документацией по разработке расширений с помощью пакета SDK для расширений Azure DevOps.

Необходимые условия

Обновление файла манифеста расширения

Ниже приведен фрагмент кода, который добавляет ваше действие в раздел вашего вклада в манифесте расширения .

...
    "contributions": [
        {
            "id": "myAction",
            "type": "ms.vss-web.action",
            "description": "Run in Hello hub action",
            "targets": [
                "ms.vss-work-web.work-item-query-menu"
            ],
            "properties": {
                "text": "Run in Hello hub",
                "title": "Run in Hello hub",
                "icon": "images/icon.png",
                "groupId": "actions",
                "uri": "action.html"
            }
        }
    ]
...

Свойства

Свойство Описание
текст Текст, отображаемый в элементе меню.
название Текст подсказки, отображаемый в элементе меню.
икона URL-адрес значка, отображаемого в элементе меню. Относительные URL-адреса разрешаются с помощью baseUri.
идентификатор группы Определяет, где этот элемент меню отображается по отношению к другим.
URI Ссылка (URI) на страницу, которая регистрирует обработчик действий меню (см. ниже).
зарегистрированныйИдентификаторОбъекта (Необязательно) Имя зарегистрированного обработчика действия меню. По умолчанию используется идентификатор участника.

Узнайте обо всех местах, где можно добавлять действия в точки расширения .

Html-страница

Действие меню представлено скриптом JavaScript, внедренным в HTML-файл. Сохраните следующее содержимое в файле и расположении, которое соответствует ссылке на него в файле манифеста расширения.

	<!DOCTYPE html>
	<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>Action Sample</title>
	</head>
	<body>
		<div>
			The end user doesn't see the content on this page.
			It is only in the background to handle the contributed menu item being selected.
		</div>
	</body>
	</html>

Ваш JavaScript

Приведенный ниже скрипт регистрирует объект обработчика для обработки действия, поместите его в head разделе предыдущей HTML-страницы.

Мы переименовали lib в node_modules/azure-devops-extension-sdk/lib в нашем файле манифеста sdk-extension.json.

<script src="lib/SDK.min.js"></script>
<script>
    SDK.init();

    // Use an IIFE to create an object that satisfies the IContributedMenuSource contract
    var menuContributionHandler = (function () {
        "use strict";
        return {
            // This is a callback that gets invoked when a user selects the newly contributed menu item
            // The actionContext parameter contains context data surrounding the circumstances of this
            // action getting invoked.
            execute: function (actionContext) {
                alert("Hello, world");
            }
        };
    }());

    // Associate the menuContributionHandler object with the "myAction" menu contribution from the manifest.
    SDK.register(SDK.getContributionId(), menuContributionHandler);
</script>

Совет

Дополнительные сведения см. в разделе точки расширяемости, меню и панели инструментов, модель контрибуции , система проектирования формул , справочник по REST API , примеры расширений и ресурсы в сообществе разработчиков .

Дальнейшие действия

Теперь, когда вы написали расширение, выполните следующие действия: "Упаковка", "Публикация" и "Установка расширения". Вы также можете ознакомиться с документацией по тестированию и отладке расширения.