DEV Community

Margaret W.N
Margaret W.N

Posted on

Recap of Vue

I reviewed the fundamentals of Vue

Creating a Vue instance

new Vue { 
Enter fullscreen mode Exit fullscreen mode

Template syntax

<p>{{ variables }}</p>
Enter fullscreen mode Exit fullscreen mode

Vue instnace Options/ properties

el - selects a html element to mount the vue instance
data - holds the data properties
computed - handles presentation logic
methods - handles data manipulation logic

Computed properties are best used when changing the presentation of data while methods are best used to change data

Vue directives

v-model use to enable two-way data binding
v-on Used to listen to events to dom events. The shorthand is @
v-for used to loop through data in Vue
v-if and v-else Used for conditional rendering
v-bind used to bind javascript expressions to a HTML attribute. The shorthand is :

That's it for day 78
Let's do this again tomorrow

Top comments (0)