j-UIStudio

El componente carga una aplicación Flow UI Studio a través de su punto final configurado. Configure la URL para ese punto final y maneje los metadatos o las actualizaciones de la aplicación con onmeta y onapp.

Este componente representa la aplicación según el esquema Total.js Flow UI Studio.

Configuración:

• url {String} el punto final de navegación que acepta las solicitudes POST y devuelve los metadatos de paso JSON
• css {Boolean} aplica el estilo de la aplicación al elemento actual (predeterminado: true)
• ssid {String} opcional, agrega un identificador de sesión a la dirección URL del flujo
• title {Boolean} opcional, reescribe document.title por el nombre de la aplicación
• plus {String} opcional, funciona solo con title:true y agrega title - config.plus
• onmeta {String} opcional, un enlace a function(meta) captura metadatos
• onapp {String} opcional, un enlace a function(app) captura un nuevo diseño de interfaz de usuario
• origin {String} opcional
• onrequest {String} opcional, un enlace al function(payload) puede modificar los datos de la solicitud
• flowoutput {Boolean} opcional, habilita salidas solo desde el componente FlowOutput (predeterminado: true)

Propiedades:

• component.app contiene una instancia app

Es bueno saberlo:

El componente amplía la instancia app agregando la propiedad breadcrumb {Array}.

Uso

<ui-component name="uistudio"
  config="url:/api/studio/;onapp:studioLoaded;loading:false"></ui-component>
<script>
  function studioLoaded(app) {
    console.log(app);
  }
</script>

El punto de navegación

El componente envía una solicitud POST al punto final configurado. la solicitud lleva el estado de navegación actual, incluyendo origin, query, un ssid opcional y el actual id, output y data cuando una aplicación emite una salida.

Devolver un id para el paso y un url para su diseño exportado UI Builder:

{
  "id": "home",
  "url": "/ui/home.json",
  "data": {}
}

El diseño que se exporta de UI Builder En el /ui/home.jsonEl componente lo descarga con GET y crea la aplicación a través de UIBuilder.build()Si la respuesta incluye una inputEl componente llama la entrada de la aplicación con input y dataEl onmeta El llamado recibe la respuesta de paso, y onapp Recibe la solicitud creada.

loading:false Desactivar el indicador de carga. para mostrarlo, declarar un j-Loading Componentes y capacidades loading.

Fuente: Total.js componentes. Copyright Peter Širka y colaboradores. Licencia MIT.