MAVO
Mavo lar deg lett legge til dynamiske aspekter til en nettside.
<head>
...
<link rel="stylesheet" href="https://get.mavo.io/mavo.css"/>
<script src="https://get.mavo.io/mavo.js"></script>
...
</head>
Lim inn koden som vist over i head på en av nettsidene dine
Definering av en mavo-app: mv-app attribute
Du aktiverer Mavo på et html-element med mv-app attributen. Verdien du skriver blir navnet på appen din, dette navnet brukes av Mavo (forskjellige plasser). Navnet må være unikt for sida, elementet med denne atributten kalles Mavo root.
<div mv-app id="mavoTest">
My first Mavo app!
</div>
Lagring: mv-storage attribute
mv-storageattributet gir beskjed til Mavo hvor data skal lagres. Du må gi en URL eller et nøkkelord som local
<div mv-app="storageTest" mv-storage="local">
My first Mavo app!
</div>
Hva blir lagra? Alle elementer med property attributt.
Property attribute
Attributtenproperty forteller Mavo hvilke elementer som skal lagres. Verdien blir en nøkkel i databasen hvor
Mavo lagrer alle data - derfor bør du velge beskrivende navn, slik som email, message.
<div mv-app="commentform" mv-storage="local" mv-autosave="0">
<label>
Email:
<input type="email" property="email" value="[email protected]" />
</label>
<label>
Message:
<textarea property="message">
Edit the form and notice how the values persist after you refresh!
</textarea>
</label>
</div>
Dersom du setter property på elementer som ikke er form-elementer (input osv), da vil Mavo gjøre dem redigerbare.
Mavo legger til controls _som lar deg skifte mellom _edit og read modus