Mostrar datos de Microsoft 365

Completado

En esta unidad, descubrirá otros componentes del Kit de herramientas de Microsoft Graph y aprenderá a mostrar datos de Microsoft 365 mediante estos componentes.

¿Qué son los componentes del Kit de herramientas de Microsoft Graph?

Los componentes del Kit de herramientas de Microsoft Graph (componentes web) son en realidad etiquetas HTML. Los componentes funcionan con proveedores para obtener tokens de acceso de usuario, llamar a la API de Microsoft Graph para recuperar los datos necesarios y mostrar los datos mediante la IU de Fluent. Estas etiquetas HTML reutilizables le ayudan a integrar diferentes tipos de datos de Microsoft 365.

Hay muchos componentes disponibles que puede usar para acceder a los conjuntos de datos de Microsoft 365 más populares de la aplicación. Vamos a analizar algunos componentes y a ver cómo usarlos en varios escenarios.

Escenario 1: Obtener eventos del calendario

Supongamos que quiere mostrar los próximos eventos de calendario para un usuario que ha iniciado sesión en la aplicación. Puede implementar fácilmente eventos de calendario mediante el componente de la mgt-agenda aplicación. De forma predeterminada, este componente devuelve eventos de calendario del punto de conexión de Microsoft Graph /me/calendarview API.

<mgt-agenda></mgt-agenda>

Captura de pantalla del componente Agenda del Kit de herramientas de Microsoft Graph.

Escenario 2: Mostrar tareas de Planner

Supongamos que quiere crear una página web para mostrar las tareas de un usuario. Puede usar el componente Tareas para obtener datos de Microsoft Planner. mgt-tasks mostrará los datos de un usuario mediante una interfaz de usuario precompilada similar a la experiencia de Microsoft 365:

<mgt-tasks></mgt-tasks>

Captura de pantalla del componente Tareas del Kit de herramientas de Microsoft Graph.

Si quieres mostrar una lista de personas en tu aplicación y buscar una persona específica, puedes usar el componente Selector de personas.

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

Animación breve del componente Selector de usuarios del Kit de herramientas de Microsoft Graph.

Puede procesar los resultados mediante atributos admitidos por el mgt-people-picker componente. Por ejemplo, puede limitar el número máximo de personas que se muestran en la lista:

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

Captura de pantalla del atributo show-max en el componente Selector de usuarios.

En resumen, todos los componentes del Kit de herramientas de Microsoft Graph comparten la misma estructura. Trabajan con proveedores para controlar la autenticación, obtener datos mediante la API de Microsoft Graph y mostrar los resultados mediante una interfaz de usuario prediseñada.