vuejs:vue.js_notes
This is an old revision of the document!
Table of Contents
Vue.js cheatsheet
Vue.js instance
Target what the Vue.js instance operates on
- Create instance:
new Vue({ el: '#vue-thing', data: {}, methods: {} })
this
refers to the Vue instance.- data is proxied into methods.
Outputing literal HTML
Binding content text
Static data
Computed data using methods
- and methods:
methods: { greet: function(s) {return s + ', ' + this.name + '!'} }
Computed data using computed properties
TODO
Binding attributes
- Use
v-bind
:v-bind:<attribute-name>="<data-name>" ...
- Shortcut:
:
is a synonym forv-bind:
.
Binding events
- Use
v-on
with single Vue/JS statement:v-on:<event-type>="<statement>"
- or method w/parameters:
v-on:<event-type>="<method-name>(p1, p2)"
- or method with event passed in as 1st param:
v-on:<event-type>="<method-name>"
- event handling can be modified (prevent, once, etc.):
v-on:<event-type>.<modifier>="<method-name>(p1, p2)"
- Shortcut:
@
is a synonym forv-on:
.
vuejs/vue.js_notes.1530150744.txt.gz · Last modified: 2018/06/28 01:52 by mithat