共用方式為

新增功能表動作

Azure DevOps 服務 |Azure DevOps Server |Azure DevOps Server 2022

在此範例中，我們會將動作新增至工作專案查詢中樞的查詢上下文選單。

提示

請參閱使用 Azure DevOps 擴充功能 SDK的最新擴充功能開發檔。

先決條件

更新延伸模組指令清單檔案

以下是將您的動作新增至 擴充功能清單的貢獻區段的程式碼片段。

...
    "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（請參閱下方）。
註冊物件識別碼 （選擇性）已註冊功能表動作處理程序的名稱。 預設為貢獻者ID。

了解您可以在 擴充點中新增動作的所有位置。

您的 HTML 頁面

您的功能表動作是由內嵌在 HTML 檔案中的 JavaScript 腳本表示。 將下列內容儲存在符合擴充套件清單檔中所參考的檔案和位置中。

	<!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

下列腳本會註冊處理程式對象來處理動作，並將它放在上一個 HTML 頁面的 head 區段中。

我們已將 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 參考、擴充功能範例，以及 開發人員社群中的資源。

後續步驟

現在您已撰寫延伸模組，接下來的步驟是套件、發佈和安裝擴充功能。 您也可以查看測試及偵錯擴充功能的文件。

  • Last updated on