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

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

  • Статья

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"
            }
        }
    ]
...

Свойства

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

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

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>

Your JavaScript

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

Мы псевдонимы, которые должны находиться node_modules/azure-devops-extension-sdk/lib в нашем sdk-extension.json файле манифестаlib.

<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, примеры расширений и ресурсы в Сообщество разработчиков.

Следующие шаги

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