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

Latest comments (0)

Interested in expanding your horizon for programming languages, but not sure where to start?

Check out this great DEV post:

Hello world in 10 different languages