Installation
GitHub
All examples below use <v-app> as well, for clarity,
but you can use <ma-data> on your own VueJS apps, without <v-app> .
<ma-data>
Authentication, data loading & storing, uploads, on a variety of cloud services.
Thin wrapper over the Madata Vue component .
You must declare the property and set it to an object or array through data() (if manually creating a Vue app)
or the data attribute (if using v-app ).
You must never overwrite the object you passed through v-model with another object.
<ma-data> relies on having a reference to it that doesn't change.
Simple example (just data loading):
<v-app data='{"cats": []}'>
<ma-data v-model="cats" src="https://github.com/leaverou/mv-data/cats2.json"></ma-data>
<article v-for="cat in cats">
{{ cat.name }} is {{ cat.age }} years old
</article>
</v-app>
For more examples and documentation, look at the Madata Vue component page.
Installation
If using <v-app>, all you need to do is include this JS file after it and you’re good:
<script src="https://mavue.mavo.io/ma-data/ma-data.js" type="module"></script>
If not using <v-app>, you can import the component individually:
import MaData from "https://mavue.mavo.io/ma-data/ma-data.js";
// Then use it in your VueJS app
createApp({
/* ... */
components: {
"ma-data": MaData
}
}).mount("#app");