Vue - Snippets: Unterschied zwischen den Versionen
Aus Wikizone
(→Basics) |
|||
| Zeile 20: | Zeile 20: | ||
<div id="myId"> | <div id="myId"> | ||
<h1>Hello World</h1> | <h1>Hello World</h1> | ||
| − | <p>{{ myVar }}</p> <!-- outputs "Learn Vue" -- | + | <p>{{ myVar }}</p> <!-- Interpolation outputs "Learn Vue" --> |
</div> | </div> | ||
</syntaxhighlight> | </syntaxhighlight> | ||
Version vom 16. Dezember 2020, 21:38 Uhr
Basics
// create App
const app = Vue.createApp();
// mount a html region
// app.mount('cssSelector');
app.mount('#myId');
// DATA OBJECT
const app = Vue.createApp({
data() { //or data: function(){...}
return{ // data always returns an object
myVar: 'Learn Vue'// can store keys with vals of every type(bool, object, string...)
};
}
});
<div id="myId">
<h1>Hello World</h1>
<p>{{ myVar }}</p> <!-- Interpolation outputs "Learn Vue" -->
</div>
