j-UIStudio

Komponenten laddar en Flow UI Studio-ansökan genom dess konfigurerade slutpunkt. ställa in url till det slutpunkten och hantera metadata eller applikationsuppdateringar med onmeta och onapp.

Denna komponent levererar appen enligt Total.js Flow UI Studio schema.

Konfigurera:

• url {String}: Navigationsändpunkten som accepterar POST-förfrågningar och returnerar JSON-stegmetadata
• css {Boolean} tillämpar app-stil på det aktuella elementet (default: true)
• ssid {String} är valfritt och lägger till en session-identifierare till URL:n för flödet
• title {Boolean} är valfritt, återskriver document.title av appen
• plus {String} är valfritt, det fungerar endast med title:true och det lägger till title - config.plus
• onmeta {String} valfritt, en länk till function(meta) fångar en meta-data
• onapp {String} valfritt, en länk till function(app) fångar en ny UI-design
• origin {String} alternativ
• onrequest {String} valfritt, en länk till function(payload) kan ändra begäran data
• flowoutput {Boolean} är valfritt, möjliggör utgångar endast från FlowOutput-komponenten (default: true)

ägodelar:

• component.app innehåller en instans av app

Bra att veta:

Komponenten utökar app-instans genom att lägga till breadcrumb {Array} egenskap.

Användning

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

Navigation Endpoint

Beståndsdelen skickar en POST-förfrågan till den konfigurerade slutpunkten. Förfrågan bär den aktuella navigationsstatus, inklusive origin, query, en valfri ssid, och den aktuellt id, output och data när en ansökan utfärdar en output.

Återställ en id för steget och en url för dess exporterade UI Builder-design:

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

Design som exporteras från UI Builder på /ui/home.jsonKomponenten ladda ner den med GET och skapar appen genom UIBuilder.build()Om svaret innehåller en input, komponenten kallar ansökan input med input och dataDen . onmeta Callback får steget svar, och onapp Den skapade ansökningsinstansen.

loading:false inaktiverar laddningsindikator. för att visa det, deklarera en j-Loading komponenter och möjliggör loading.

Källa till: Total.js komponenterCopyright Peter Širka och bidragsgivare. Min licens.