summaryrefslogtreecommitdiff
path: root/snippets/vue.snippets
diff options
context:
space:
mode:
Diffstat (limited to 'snippets/vue.snippets')
-rw-r--r--snippets/vue.snippets208
1 files changed, 0 insertions, 208 deletions
diff --git a/snippets/vue.snippets b/snippets/vue.snippets
deleted file mode 100644
index 9462635..0000000
--- a/snippets/vue.snippets
+++ /dev/null
@@ -1,208 +0,0 @@
-# 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
- <slot></slot>
-
-snippet template
- <template></template>
-
-snippet transition
- <transition></transition>
-
-# The following snippets create more complex boilerplate code.
-
-snippet vbase
- <template>
- <div>
-
- </div>
- </template>
-
- <script>
- export default{
- ${0}
- }
- </script>
-
- <style scoped>
-
- </style>
-
-snippet vimport:c
- import ${1:Name} from './components/$1.vue';
-
- export default {
- components: {
- $1
- }
- }
-
-snippet vactions
- actions: {
- ${1:updateValue}({commit}, ${2:payload}) {
- commit($1, $2);
- }
- },
-
-# Add in js animation hooks
-snippet vanim:js:el
- <transition
- @before-enter="beforeEnter"
- @enter="enter"
- @after-enter="afterEnter"
- @enter-cancelled="enterCancelled"
-
- @before-Leave="beforeLeave"
- @leave="leave"
- @after-leave="afterLeave"
- @leave-cancelled="leaveCancelled"
- :css="false">
-
- </transition>
-
-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="${1}"
-
-snippet vdata
- data() {
- return {
- ${1:key}: ${2:value}
- };
- },
-
-snippet vmounted
- mounted() {
- console.log('mounted');
- },
-
-snippet vmethods
- methods: {
- ${1:method}() {
- console.log('method');
- }
- },
-
-snippet vcomputed
- computed: {
- ${1:fnName}() {
- return;
- }
- },
-
-snippet vfilter
- filters: {
- ${1:fnName}: function(${2:value}) {
- return;
- }
- },
-
-snippet vfor
- <div v-for="${1:item} in ${2:items}" :key="$1.id">
- {{ $1 }}
- </div>
-
-snippet vgetters
- getters: {
- ${1:value}: state => {
- return state.$1;
- }
- },
-
-snippet vimport
- import ${1:New} from './components/$1.vue';
-
-snippet vkeep
- <keep-alive>
- <component :is="">
- <p>default</p>
- </component>
- </keep-alive>
-
-snippet vmixin
- const ${1:mixinName} = {
- mounted() {
- console.log('hello from mixin!')
- },
- }
- const ${2:Component} = Vue.extend({
- mixins: [$1]
- })
-
-snippet vmutations
- mutations: {
- ${1:updateValue}(state, ${3:payload}) => {
- state.${2:value} = $3;
- }
- },
-
-snippet vprops:d
- ${1:propName}: {
- type: ${2:Number},
- default: ${0}
- },
-
-snippet vprops
- ${1:propName}: {
- type: ${2:Number}
- },
-
-snippet vstore
- import Vue from 'vue';
- import Vuex from 'vuex';
-
- Vue.use(Vuex);
-
- export const store = new Vuex.Store({
- state: {
- ${1:key}: ${2:value}
- }
- });
-
-
-# vue-i18n snippets https://github.com/kazupon/vue-i18n
-
-snippet trans
- $t('$1')
-
-# Translation with parameter
-snippet transc
- $t('$1', { $2: $3 })
-