Veebimallid komponentidena
Veebimalle saab luua ja kasutada veebilehekomponentidena, et koostajad saaksid neid taaskasutatavaid komponente kasutada ja pakkuda nõuetele vastavaid parameetreid.
Arendajana saate luua veebimalli, mis pakub kindlaid funktsionaalsusi, mida koostajad veebilehtede kujundamisel konfigureerida saavad.
Näiteks saate luua veebimallikomponentidena järgmised komponendid (ja muud), mida saab kujundusstuudios konfigureerida:
- Asukohakirje kaartide abil
- Karusselli kuva
- Piltide või videote galerii
Komponendi lisamiseks veebilehele saate lehte redigeerida Visual Studio Code for the Web abil lisada Liquidi kaasamisobjekt lehekoopiale:
{% include '<<web template name>>' <<parameter 1>>: '<<value>>' <<paramter 2>>: '<<value>>' %}
Näide:
{% include 'webTemplateName' name: 'Topics' count:'4' %}
Veebimalli komponendi loomine
Veebimallikomponendi loomiseks, millele saate lubada koostajal parameetreid edastada, peate lisama {% manifest %}
veebimallile sildi. Manifesti jaotis kirjeldab parameetreid, mida saate edastamiseks konfigureerida ja kasutada veebimallikoodi.
Manifest on JSON-objekt, mis määratleb kujundusstuudios kuvatava veebimalli omadused: tüüp, kuva nimi, kirjeldus, tabelid ja parameetrid. Neid veebimalliatribuute saab kasutada kutseliste arendajate vahelise vahe loomiseks ja vähese koodikirjutusvajadusega redigeerimiseks. Parameetrid on seotud muutujatega, mida arendajad oma lähtekoodis kasutavad, ja vähese koodikirjutusvajadusega koostajad saavad oma väärtusi konfigureerida.
Manifesti toetatud omadused
Manifesti atribuut | Kirjeldus |
---|---|
Tüüp | Tuleb seada väärtusele Funktsionaalne. Funktsionaalne: lisage veebimalli komponent disainistuudio komponendi lisamise protsessi kaudu . |
displayName | Veebimallikomponendi sõbralik nimi, mis tuuakse esile kujundusstuudios. |
kirjeldus | Veebimallikomponendi kirjeldus. |
tabelid | Rakenduse Dataverse tabelite massiiv, mille abil koostaja saab navigeerida otse andme tööruumiAndmete tööruumi, et tabelite konfiguratsiooni või kirjeid redigeerida. Tabelid tuleb loendada kasutades nende loogilist nime. |
parameetrid | Määratud atribuutidega parameetrid: id:vastab muutujale, mida kasutatakse veebimalli koodis ja märgendis Liquid include. displayName: Sõbralik nimi disainistuudios. kirjeldus:lühike tekst, mis on esitatud kohtspikri kaudu, et pakkuda komponenti kasutavatele tegijatele konteksti. |
Näide:
{% manifest %}
{
"type": "Functional",
"displayName": "Data Cards",
"description": "This component displays data using a cards layout",
"tables": ["cards"],
"params": [
{
"id": "title",
"displayName": "Title",
"description": "Heading for this component"
},
{
"id": "count",
"displayName": "Count",
"description": "No. of items to be displayed"
}]
}
{% endmanifest %}
<!--additional web template code to use parameters to specialized functionality-->
Veebimallikoodi kirjutamine
Juhul kui soovite olemasolevat valmis veebimalli laiendada, soovitame luua veebimalli koopia ja laiendada seda koopiat, et säilitada lähtekood ja vältida andmekadu.
Kõik parameetrid antakse üle stringidena. Koodis on soovitatav parameetriväärtused teisendada vastavalt vajadusele nõutud tüüpideks. Parameetrite teisendamiseks võite kasutada Liquid filtreid.
Näited:
{% assign posts_count = count | integer %}
{% assign column_count = columns | integer %}
Veebimallikomponendi veebilehel konfigureerimine
Veebimallikomponendi loomisel (koos manifesti jaotisega) saate lisada veebilehe koopiale vastava Liquid viite (kasutades rakendusi Visual Studio Code for the web, Visual Studio Code, portaali haldusrakendust või muid meetodeid), mis edastavad erinevaid parameetreid, nagu on näidatud käesolevas näites.
{% include 'webTemplateName' name: 'Topics' count:'4' %}
Parameetreid saate konfigureerida otse kujundusstuudios. Sel viisil saab kutseline arendaja luua täiustatud komponente, kasutades veebimalle, mida madala koodiga koostajad saavad konfigureerida kujundusstuudio abil.
Piirangud ja teadaolevad probleemid
Veebimalli komponentide pesastamist muudeks veebimallikomponentideks ei toetata.