通过

在未启用阅读窗格或未选择邮件的情况下激活 Outlook 加载项

  • 项目

使用简单的清单配置，可以为邮件读取图面创建 Outlook 加载项，以激活未启用阅读窗格或首先从邮箱中选择邮件的任务窗格。 此功能称为“无项上下文”。 按照演练了解详细信息并解锁加载项的其他功能。 例如，你可以让用户直接从其 Outlook 客户端访问不同数据源（例如 OneDrive 或客户关系管理 (CRM) 系统）的内容。

注意

要求集 1.13 中引入了对此功能的支持。 请查看支持此要求集的客户端和平台。

尽管Outlook 网页版和新的 Outlook on Windows 支持要求集 1.13，但如果隐藏阅读窗格或未选择邮件，外接程序将不会激活。 有关详细信息，请参阅 Outlook 网页版 和新的 Outlook on Windows 中的功能支持。

设置环境

完成 Outlook 快速入门 ，在其中使用 适用于 Office 加载项的 Yeoman 生成器创建 Outlook 加载项。

若要在预先存在的外接程序项目中启用此功能，请参阅 配置清单。

配置清单

配置清单的步骤因外接程序使用的清单类型而异。

  1. 在首选代码编辑器中，打开创建的 Outlook 快速入门 项目。

  2. 打开位于项目根目录处的 manifest.json 文件。

  3. 在“extensions.runtimes”数组的第一个对象中，执行以下操作：

    1. 将“requirements.capabilities.minVersion”更改为“1.13”。
    2. 将“supportsNoItemContext”属性添加到“actions”数组中的 对象，并将其值设置为 true。
    3. 将“multiselect”属性添加到同一对象，并将其设置为 true。
    4. 将同一对象中的“可固定”属性更改为 true。

    完成后，应如下所示。

    "runtimes": [
    {
        "requirements": {
            "capabilities": [
                {
                    "name": "Mailbox",
                    "minVersion": "1.13"
                }
            ]
        },
        "id": "TaskPaneRuntime",
        "type": "general",
        "code": {
            "page": "https://localhost:3000/taskpane.html"
        },
        "lifetime": "short",
        "actions": [
            {
                "id": "TaskPaneRuntimeShow",
                "type": "openPage",
                "view": "dashboard",
                "pinnable": true,
                "supportsNoItemContext": true,
                "multiselect": true
            }
        ]
    }
]

  4. 删除“extensions.runtimes”数组中的第二个对象，其“id”为“CommandsRuntime”。

  5. “extensions.ribbons.tabs.groups.controls”数组包含两个 对象。 删除第二个，其“id”为“ActionButton”。

配置任务窗格

  1. 在项目中，导航到 taskpane 文件夹，然后打开 taskpane.html。

  2. 将整个 <body> 元素替换为以下标记。

    <body class="ms-font-m ms-welcome ms-Fabric">
    <header class="ms-welcome__header ms-bgColor-neutralLighter">
        <img width="90" height="90" src="../../assets/logo-filled.png" alt="logo" title="Add-in logo" />
        <h1 class="ms-font-su">Activate your add-in without enabling the Reading Pane or selecting a message</h1>
    </header>
    <section id="sideload-msg" class="ms-welcome__main">
        <h2 class="ms-font-xl">Please <a target="_blank" href="https://learn.microsoft.com/office/dev/add-ins/testing/test-debug-office-add-ins#sideload-an-office-add-in-for-testing">sideload</a> your add-in to see app body.</h2>
    </section>
    <main id="app-body" class="ms-welcome__main" style="display: none;">
        <ul class="ms-List ms-welcome__features">
            <li class="ms-ListItem">
                <i class="ms-Icon ms-Icon--CheckList ms-font-xl"></i>
                <span class="ms-font-m">Item multi-select is automatically enabled when the <b>SupportsNoItemContext</b> manifest element is set to <code>true</code>. You can test this by selecting multiple messages in Outlook, then choosing <b>Show Taskpane</b> from the ribbon.</span>
            </li>
            <li class="ms-ListItem">
                <i class="ms-Icon ms-Icon--Pin ms-font-xl"></i>
                <span class="ms-font-m">Support to pin the task pane is also automatically enabled. You can test this by selecting the <b>pin</b> icon from the top right corner of the task pane.</span>
            </li>
            <li class="ms-ListItem">
                <i class="ms-Icon ms-Icon--DockRight ms-font-xl"></i>
                <span class="ms-font-m">This feature can only be implemented with a task pane.</span>
            </li>
            <li class="ms-ListItem">
                <i class="ms-Icon ms-Icon--Design ms-font-xl"></i>
                <span class="ms-font-m">Implement your scenario using this feature today! For example, enable your users to access content from different data sources, such as OneDrive or your customer relationship management (CRM) system, without first selecting a message.</span>
            </li>
        </ul>
    </main>
</body>

  3. 保存所做的更改。

更新任务窗格 JavaScript 文件

  1. 在 任务窗格 文件夹中，打开 taskpane.js。

  2. 导航到 Office.onReady 函数，并将其内容替换为以下代码。

    if (info.host === Office.HostType.Outlook) {
    document.getElementById("sideload-msg").style.display = "none";
    document.getElementById("app-body").style.display = "flex";
}

  3. 保存所做的更改。

试用

  1. 在终端中，在项目的根目录中运行以下代码。 这会启动本地 Web 服务器并旁加载加载项。

    npm start

    提示

    如果加载项未自动旁加载，请按照 旁加载 Outlook 加载项 中的说明进行测试，在 Outlook 中手动旁加载它。

  2. 导航到收件箱并执行下列操作之一：

    • 关闭阅读窗格。 有关指导，请参阅 使用和配置阅读窗格以预览邮件的“打开、关闭或移动阅读窗格”部分。
    • 取消选择消息（如果适用）。 若要取消选择邮件，请按住 Ctrl 键并选择该邮件。

  3. 从功能区中选择“ 显示任务窗格 ”。

  4. 浏览并测试任务窗格中列出的建议。

  5. 如果要停止本地 Web 服务器并卸载加载项，请按照适用的说明操作：

    • 若要停止服务器，请运行以下命令。 如果使用 npm start了 ，则以下命令还应卸载加载项。

      npm stop

    • 如果手动旁加载加载项，请参阅 删除旁加载加载项。

支持项多选和可固定任务窗格功能

启用对清单中无项上下文的支持会自动启用对 项多选 和 可固定任务窗格 功能的支持，即使未在清单中显式配置这些功能也是如此。

Outlook 网页版和新 Outlook on Windows 中的功能支持

在 Outlook 网页版 和新的 Outlook on Windows 中，当隐藏阅读窗格或未选择邮件时，不启用任何项目上下文的加载项不会激活。 这是因为 Outlook 网页版 中的加载项命令不会出现在功能区上。 若要从“消息读取”图面激活加载项，必须首先选择一条消息，然后从消息操作栏中选择加载项命令。

由于启用任何项目上下文会自动启用项目多选功能，因此你将能够在多个邮件项目上激活Outlook 网页版和新的 Outlook on Windows 中的外接程序。

另请参阅