修改或删除频道组选项卡Modify or remove a channel group tab

您可以通过在应用中支持删除和修改选项来扩展和增强用户体验。You can extend and enhance the user experience by supporting removal and modification options in your app. 通过团队,用户可以重命名或删除频道/组选项卡,还可以允许用户在安装后重新配置您的选项卡。Teams enables users to rename or remove a channel/group tab and you can permit users to reconfigure your tab after installation. 此外,您的选项卡删除体验可以包括在删除选项卡或授予用户删除内容(如删除或存档内容)时,指定内容会发生什么情况。Additionally, your tab removal experience can include designating what happens to the content when your tab is removed or giving users post-removal options such as deleting or archiving the content.

允许在安装后重新配置您的选项卡Enable your tab to be reconfigured after installation

您 ** 的manifest.js** 定义您的选项卡的特性和功能。Your manifest.json defines your tab's features and capabilities. Tab 实例 canUpdateConfiguration 属性采用一个布尔值,该值指示用户是否可以在创建选项卡后修改或重新配置该选项卡:The tab instance canUpdateConfiguration property takes a Boolean value that indicates whether a user can modify or reconfigure the tab after it is created:

名称Name 类型Type 最大大小Maximum size 必需Required 说明Description
canUpdateConfiguration BooleanBoolean 一个值,指示是否可在用户创建之后更新该选项卡的配置实例。A value indicating whether an instance of the tab's configuration can be updated by the user after creation. 设置 trueDefault: true

将选项卡上载到频道或组聊天后,团队将为您的选项卡添加一个右键单击下拉菜单。可用选项由 canUpdateConfiguration 以下设置决定:When your tab is uploaded to a channel or group chat, Teams will add a right-click drop-down menu for your tab. The available options are determined by the canUpdateConfiguration setting:

canUpdateConfiguration truetrue falsefalse descriptiondescription
设置Settings configurationUrl页面在 IFrame 中重新加载,以允许用户重新配置选项卡。The configurationUrl page is reloaded in an IFrame allowing the user to reconfigure the tab.
重命名Rename 用户可以更改在选项卡栏中显示的选项卡名称。The user can change the tab name as it appears in the tab bar.
删除Remove 如果 removeURL 属性和值包含在 配置页面中,则 删除页面 会加载到 IFrame 中,并向用户显示。If the removeURL property and value are included in the configuration page, the removal page is loaded into an IFrame and presented to the user. 如果不包含删除页面,则会向用户显示确认对话框。If a removal page is not included the user is presented with a confirm dialog box.

为应用程序创建选项卡删除页Create a tab removal page for your application

可选的 "删除" 页面是您承载的 HTML 页面,在删除该选项卡时会显示该页面。The optional removal page is an HTML page that you host and is displayed when the tab is removed. 删除页面 URL 由 setSettings() 配置页面中的方法指定。The removal page URL is designated by the setSettings() method within your configuration page. 与应用程序中的所有页面一样,删除页必须符合 团队选项卡要求As with all pages in your app, the removal page must comply with Teams tab requirements.

注册删除处理程序Register a remove handler

(可选)在删除页面逻辑中,可以在 registerOnRemoveHandler((RemoveEvent) => {} 用户删除现有的选项卡配置时调用事件处理程序。Optionally, within your removal page logic, you can invoke the registerOnRemoveHandler((RemoveEvent) => {} event handler when the user removes an existing tab configuration. RemoveEvent当用户尝试删除内容时,该方法将采用接口,并在处理程序中执行代码。The method takes in the RemoveEvent interface and executes the code in the handler when a user attempts to remove content. 它用于执行清理操作,例如,删除用于为选项卡内容加电的基础资源。It is used to perform cleanup operations such as removing the underlying resource powering the tab content. 一次只能注册一个删除处理程序。Only one remove handler can be registered at a time.

RemoveEvent 接口描述了具有以下两种方法的对象:The RemoveEvent interface describes an object with two methods:

  • notifySuccess()函数是必需的。The notifySuccess() function is required. 它指示已成功删除基础资源,并且可以删除其内容。It indicates that the removal of the underlying resource succeeded and its content can be removed.

  • notifyFailure(string)函数是可选的。The notifyFailure(string) function is optional. 它指示删除基础资源失败且无法删除其内容。It indicates that removal of the underlying resource failed and its content cannot be removed. 可选的字符串参数指定失败的原因。The optional string parameter specifies a reason for the failure. 如果提供,则向用户显示此字符串;否则,将显示一个一般性错误。If provided, this string is displayed to the user; otherwise a generic error is displayed.

使用 getSettings() 函数Use the getSettings() function

您可以使用 getSettings() 来指定要删除的选项卡内容。You can use getSettings()to designate the tab content to be removed. getSettings((Settings) =>{})函数采用 Settings interface 并提供可检索的有效设置属性值。The getSettings((Settings) =>{}) function takes in the Settings interface and provides the valid settings property values that can be retrieved.

使用 getContext() 函数Use the getContext() function

您可以使用 getContext() 来检索运行该帧的当前上下文。You can use getContext() to retrieves the current context in which the frame is running. getContext((Context) =>{})函数采用 Context interface 并提供 Context 可在删除页面逻辑中使用的有效属性值,以确定要在删除页面中显示的内容。The getContext((Context) =>{}) function takes in the Context interface and provides valid Context property values that you can use in your removal page logic to determine the content to display in the removal page.

包括身份验证Include authentication

您可能需要先进行身份验证,然后才能允许用户删除选项卡内容。You might require authentication before allowing a user to delete the tab content. 上下文信息可用于帮助构造身份验证请求和授权页面 Url。Context information can be used to help construct authentication requests and authorization page URLs. 请参阅 Microsoft 团队身份验证流的选项卡See Microsoft Teams authentication flow for tabs. 确保在您的选项卡页中使用的所有域都列在 manifest.json validDomains 数组中。Make sure that all domains used in your tab pages are listed in the manifest.json validDomains array.

以下是选项卡删除代码块示例:Below is a sample tab removal code block:

<body>
  <button onclick="onClick()">Delete this tab and all underlying data?</button>
  <script>
    microsoftTeams.initialize();
    microsoftTeams.settings.registerOnRemoveHandler((removeEvent) => {
      // Here you can designate the tab content to be removed and/or archived.
        microsoftTeams.settings.getSettings((settings) => {
        settings.contentUrl = "..."
        });
        removeEvent.notifySuccess();
    });

    const onClick() => {
        microsoftTeams.settings.setValidityState(true);
    }
  </script>
</body>

当用户从选项卡的下拉菜单中选择 " 删除 " 时,团队会将 " removeUrl 配置" 页面 中指定的可选页面 () 到 IFrame 中。When a user selects Remove from the tab's drop-down menu, Teams will load the optional removeUrl page (designated in your configuration page) into an IFrame. 此时,将向用户提供一个加载的按钮,该按钮 onClick() 调用 microsoftTeams.settings.setValidityState(true) 并启用位于删除页面 IFrame 底部附近的 " 删除 " 按钮。Here, the user is presented with a button loaded with the onClick() function that calls microsoftTeams.settings.setValidityState(true) and enables the Remove button located near the bottom of the removal page IFrame.

执行删除处理程序后, removeEvent.notifySuccess()removeEvent.notifyFailure() 通知团队内容删除结果。Following the execution of the remove handler, removeEvent.notifySuccess() or removeEvent.notifyFailure() notifies Teams of the content removal outcome.

备注

为了确保授权用户对选项卡的控制不被禁止,团队将删除成功和失败案例中的选项卡。To ensure that an authorized user's control over a tab is not inhibited, Teams will remove the tab in both success and failure cases.</span> 即使您的选项卡未被调用,团队也会在5秒后启用 " 删除 " 按钮 setValidityState()Teams enables the Remove button after 5 seconds, even if your tab hasn't called setValidityState().</span> 当用户选择 " 删除 团队" 时,将在30秒后删除该选项卡,而不管您的操作是否已完成。When the user selects Remove Teams removes the tab after 30 seconds regardless of whether your actions have completed.