显示来自 Microsoft 365 的数据

  • 5 分钟

在本单元中，你将发现其他 Microsoft Graph 工具包组件，并了解如何使用这些组件显示来自 Microsoft 365 的数据。

什么是 Microsoft Graph 工具包组件？

Microsoft Graph 工具包组件（Web 组件）实际上是 HTML 标记。 组件与提供程序合作获取用户访问令牌，调用Microsoft Graph API 以检索所需数据，并使用 Fluent UI 显示数据。 这些可重用的 HTML 标记可帮助你集成来自 Microsoft 365 的不同类型的数据。

有许多组件可用于访问应用程序中最常用的 Microsoft 365 数据集。 让我们讨论一些组件，并了解如何在各种方案中使用它们。

方案 1：从日历中获取事件

假设要显示应用程序中已登录用户即将发生的日历事件。 可以在应用中使用 mgt-agenda 组件轻松实现日历事件。 默认情况下，此组件从 Microsoft Graph /me/calendarview API 终结点返回日历事件。

<mgt-agenda></mgt-agenda>

Microsoft Graph工具包的日程组件的屏幕截图。

方案 2：显示规划器中的任务

假设你想要生成一个网页来显示用户的任务。 可以使用任务组件从 Microsoft Planner 获取数据。 mgt-tasks 将使用类似于 Microsoft 365 体验的预生成 UI 显示用户的数据：

<mgt-tasks></mgt-tasks>

Microsoft Graph 工具包的任务组件的屏幕截图。

如果要在应用中显示人员列表并搜索特定人员，可以使用人员选取器组件。

<mgt-people-picker></mgt-people-picker>

Microsoft Graph 工具包的人员选取器组件的简短动画。

可以使用组件支持 mgt-people-picker 的属性来处理结果。 例如，可以限制列表中显示的最大人数：

<mgt-people-picker show-max="3"></mgt-people-picker>

人员选取器组件中 show-max 属性的屏幕截图。

总之，Microsoft Graph 工具包中的所有组件共享相同的结构。 它们与提供程序一起处理身份验证，使用 Microsoft Graph API 获取数据，并使用预生成的 UI 显示结果。