Compartir a través de


Tutorial: usar componentes de código de conjunto de datos

Nota

A partir del 12 de octubre de 2022, los portales de Power Apps son Power Pages. Más información: Microsoft Power Pages ya está disponible para el público en general (blog)
Pronto migraremos y fusionaremos la documentación de los portales de Power Apps con la documentación de Power Pages.

En este tutorial, creará un componente de ejemplo utilizando Power Apps component framework. Power Apps component framework permite a los desarrolladores profesionales y creadores de aplicaciones crear componentes de código para aplicaciones basadas en modelos y de lienzo. Estos componentes de código pueden proporcionar una experiencia mejorada para los usuarios que trabajan con datos en formularios, vistas y paneles. Más información: usar componentes de código en portales

Nota

  • Este tutorial se basa en el tutorial de Power Apps component framework existente que le guía a través del componente control de cuadrícula de Power Apps (versión preliminar) en la lista y la subcuadrícula en la página en blanco. También puede usar cualquier componente nuevo y agregarlo a otra página web para este tutorial. En este caso, asegúrese de utilizar su componente y página web cuando siga los pasos de este tutorial. Para saber qué componentes de código son compatibles con los portales, consulte Usar componentes de código en portales

En este tutorial, aprenderá a:

  • Crear un componente de ejemplo usando Power Apps component framework
  • Empaquetar el componente en un entorno de Microsoft Dataverse
  • Configurar Power Pages para agregar el componente a una página web
  • Visitar su página web de Power Pages para interactuar con el componente

Requisitos previos

  • Versión del portal  9.4.9.xx o superior. 
  • Paquete de portal básico de Dataverse  9.3.2209.x  o superior. 

Paso 1: Crear el primer componente de código

Complete el tutorial Crear el primer componente.

Nota

Al final del tutorial Crear el primer componente, tendrá el componente llamado TSLinearInputComponent empaquetado y cargado en su entorno de Dataverse.

Paso 2: Agregar el componente de código a las vistas o subcuadrículas en una aplicación basada en modelos

Para agregar su componente a la tabla  Cuenta, vistas y subcuadrículas, siga los pasos en Convertir vistas y subcuadrículas en cuadrículas editables (versión preliminar) 

Paso 3: Agregar el componente de código a una lista y subcuadrícula en el portal

En este paso, creará un nuevo formulario básico en portales y luego agregará el componente al formulario básico creado. En su lugar, también puede utilizar un formulario básico existente. 

Paso 3.1: Agregar el componente de código a las listas

  1. Abra la aplicación Administración del portal.

  2. En el panel izquierdo, en  Contenido, seleccione  lista

  3. Seleccione Nuevo

  4. Especifique un  Nombre. Por ejemplo,  Lista de cuentas con componente de código

  5. Para  Nombre de la tabla, seleccione la tabla a la que agregó el componente de código anteriormente en este tutorial. 

  6. Seleccione el  Sitio web del portal. 

  7. Seleccione Usar un componente de código configurado como  

    Usar un componente de código configurado

Paso 3.2: Agregar el componente de código a las vistas de una lista

Siga estos pasos para habilitar el control en la vista de entidad en Dataverse. 

  1. Abra la aplicación Administración del portal.

  2. Especifique un  Nombre. Por ejemplo,  Lista de cuentas con componente de código

  3. Para  Nombre de la tabla, seleccione la tabla a la que agregó el componente de código anteriormente en este tutorial. 

  4. Seleccione el  Sitio web del portal. 

  5. Agregue vistas en la cuadrícula de configuración avanzada. 

    Agregue vistas en la cuadrícula de configuración avanzada.

  6. Seleccione Usar un componente de código configurado como  

Paso 3.3: Agregar el componente de código a la subcuadrícula 

  1. Abra la aplicación Administración del portal.

  2. En el panel izquierdo, en Contenido, seleccione Formularios básicos

  3. Seleccione el formulario básico que ha creado en el paso anterior. 

  4. Seleccione Relacionadas

  5. Seleccione Metadatos del formulario básico

  6. Seleccione Nuevos metadatos del formulario básico

  7. Seleccionar Tipo como Subcuadrícula

  8. Seleccione Nombre de subcuadrícula

    Agregar componente de código a una subcuadrícula.

  9. Para  Estilo del control, seleccione  Componente de código

    Seleccione el estilo del control.

Agregar un componente de código basado en conjuntos de datos usando una etiqueta de Liquid

Los componentes de código basados en conjuntos de datos se pueden agregar usando la etiqueta de plantilla Liquid  codecomponent . La clave para indicar el componente de código que debe cargarse se pasa usando el atributo de nombre. La clave puede ser el GUID (que es el id. del componente de código) o el nombre del componente de código importado en Microsoft Dataverse. 

Los valores de las propiedades que espera el componente de código deben pasarse como un par clave/valor separados por ":" (signo de dos puntos), donde la clave es el nombre de la propiedad y el valor es el valor de la cadena JSON. 

{% codecomponent name: <ID or name> <property1:value> <property2:value> %}

Para obtener más información, consulte Usar etiqueta de plantilla de Liquid para los componentes de código.

Limitaciones

Las acciones y la configuración del filtro de metadatos en listas y subcuadrículas no son compatibles con el control de cuadrícula de Power Apps.

Consulte también

Usar componentes de código en portales de Power Apps