# This snippet file enables vue files to use tabs for html, js and css. It also
# includes some vue-specific html-like snippets, as well as some general
# boilerplate code for vue.
extends html, javascript, css
# These snippets form a port of Sarah Drasner's vue-sublime-snippets
# some html-like snippets
snippet slot
snippet template
snippet transition
# The following snippets create more complex boilerplate code.
snippet vbase
snippet vimport:c
import New from './components/New.vue';
export default{
components: {
appNew: New
}
}
snippet vactionsis now
actions: {
updateValue({commit}, payload) {
commit(updateValue, payload);
}
}
# Add in js animation hooks
snippet vanim:js:el
snippet vanim:js:method
methods: {
beforeEnter(el) {
console.log('beforeEnter');
},
enter(el, done) {
console.log('enter');
done();
},
afterEnter(el) {
console.log('afterEnter');
},
enterCancelled(el, done) {
console.log('enterCancelled');
},
beforeLeave(el) {
console.log('beforeLeave');
},
leave(el, done) {
console.log('leave');
done();
},
afterLeave(el) {
console.log('afterLeave');
},
leaveCancelled(el, done) {
console.log('leaveCancelled');
}
}
snippet vcl
@click=""
snippet vdata
data: function () {
return {
key: value
};
}
snippet vfilter
filters: {
fnName: function (v) {
return;
}
}
snippet vfor
{{ item }}
{
return state.value;
}
}
snippet vimport
import New from './components/New.vue';
snippet vkeep
default
snippet vmixin
// define a mixin object
var myMixin = {
created: function () {
this.hello()
},
methods: {
hello: function () {
console.log('hello from mixin!')
}
}
}
// define a component that uses this mixin
var Component = Vue.extend({
mixins: [myMixin]
})
var component = new Component() // -> "hello from mixin!"
snippet vmutations
// define a mixin object
var myMixin = {
created: function () {
this.hello()
},
methods: {
hello: function () {
console.log('hello from mixin!')
}
}
}
// define a component that uses this mixin
var Component = Vue.extend({
mixins: [myMixin]
})
var component = new Component() // -> "hello from mixin!"
snippet vprops:d
propName: {
type: Number,
default: 100
},
snippet vprops
propName: {
type: Number
},