Files
keycodex/snippets/languages/frameworks/vue/html.json
T

397 lines
11 KiB
JSON
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
{
"template": {
"prefix": "template",
"body": [
"<template>",
"\t<${1:div}$2>",
"\t\t$0",
"\t</${1:div}>",
"</template>"
],
"description": "template element"
},
"v-text": {
"prefix": "vText",
"body": [
"v-text=\"${1:msg}\""
],
"description": "Expects: string. Updates the element’s textContent."
},
"v-html": {
"prefix": "vHtml",
"body": [
"v-html=\"${1:html}\""
],
"description": "Expects: string. Updates the element’s innerHTML."
},
"v-show": {
"prefix": "vShow",
"body": [
"v-show=\"${1:condition}\""
],
"description": "Expects: any"
},
"v-if": {
"prefix": "vIf",
"body": [
"v-if=\"${1:condition}\""
],
"description": "Expects: any"
},
"v-else": {
"prefix": "vElse",
"body": [
"v-else"
],
"description": "Does not expect expression. previous sibling element must have v-if or v-else-if."
},
"v-else-if": {
"prefix": "vElseIf",
"body": [
"v-else-if=\"${1:condition}\""
],
"description": "Expects: any. previous sibling element must have v-if or v-else-if."
},
"v-for-without-key": {
"prefix": "vForWithoutKey",
"body": [
"v-for=\"${1:item} in ${2:items}\""
],
"description": "Expects: Array | Object | number | string"
},
"v-for": {
"prefix": "vFor",
"body": [
"v-for=\"(${1:item}, ${2:index}) in ${3:items}\" :key=\"${4:index}\""
],
"description": "Expects: Array | Object | number | string"
},
"v-on": {
"prefix": "vOn",
"body": [
"v-on:${1:event}=\"${2:handle}\""
],
"description": "Expects: Function | Inline Statement"
},
"v-bind": {
"prefix": "vBind",
"body": [
"v-bind$1=\"${2}\""
],
"description": "Expects: any (with argument) | Object (without argument)"
},
"v-model": {
"prefix": "vModel",
"body": [
"v-model=\"${1:something}\""
],
"description": "Expects: varies based on value of form inputs element or output of components"
},
"v-slot": {
"prefix": "vSlot",
"body": [
"v-slot$1=\"${2}\""
],
"description": "Expects: JavaScript expression that is valid in a function argument position (supports destructuring in supported environments). Optional - only needed if expecting props to be passed to the slot."
},
"v-pre": {
"prefix": "vPre",
"body": [
"v-pre"
],
"description": "Does not expect expression"
},
"v-cloak": {
"prefix": "vCloak",
"body": [
"v-cloak"
],
"description": "Does not expect expression"
},
"v-once": {
"prefix": "vOnce",
"body": [
"v-once"
],
"description": "Does not expect expression"
},
"key": {
"prefix": "key",
"body": [
":key=\"${1:key}\""
],
"description": "Expects: string. Children of the same common parent must have unique keys. Duplicate keys will cause render errors."
},
"ref": {
"prefix": "ref",
"body": [
"ref=\"${1:reference}\"$0"
],
"description": "Expects: string. ref is used to register a reference to an element or a child component. The reference will be registered under the parent component’s $refs object. If used on a plain DOM element, the reference will be that element; if used on a child component, the reference will be component instance."
},
"slotA": {
"prefix": "slotA",
"body": [
"slot=\"$1\"$0"
],
"description": "slot=''. Expects: string. Used on content inserted into child components to indicate which named slot the content belongs to."
},
"slotE": {
"prefix": "slotE",
"body": [
"<slot$1>$2</slot>$0"
],
"description": "<slot></slot>. Expects: string. Used on content inserted into child components to indicate which named slot the content belongs to."
},
"slotScope": {
"prefix": "slotScope",
"body": [
"slot-scope=\"$1\"$0"
],
"description": "Used to denote an element or component as a scoped slot. The attribute’s value should be a valid JavaScript expression that can appear in the argument position of a function signature. This means in supported environments you can also use ES2015 destructuring in the expression. Serves as a replacement for scope in 2.5.0+."
},
"scope": {
"prefix": "scope",
"body": [
"scope=\"${1:this api replaced by slot-scope in 2.5.0+}\"$0"
],
"description": "Used to denote a <template> element as a scoped slot, which is replaced by `slot-scope` in 2.5.0+."
},
"component": {
"prefix": "component",
"body": [
"<component :is=\"${1:componentId}\"></component>$0"
],
"description": "component element"
},
"keep-alive": {
"prefix": "keepAlive",
"body": [
"<keep-alive$1>",
"$2",
"</keep-alive>$0"
],
"description": "keep-alive element"
},
"transition": {
"prefix": "transition",
"body": [
"<transition$1>",
"$2",
"</transition>$0"
],
"description": "transition element"
},
"transition-group": {
"prefix": "transitionGroup",
"body": [
"<transition-group$1>",
"$2",
"</transition-group>"
],
"description": "transition-group element"
},
"enter-class": {
"prefix": "enterClass",
"body": [
"enter-class=\"$1\"$0"
],
"description": "enter-class=''. Expects: string."
},
"leave-class": {
"prefix": "leaveClass",
"body": [
"leave-class=\"$1\"$0"
],
"description": "leave-class=''. Expects: string."
},
"appear-class": {
"prefix": "appearClass",
"body": [
"appear-class=\"$1\"$0"
],
"description": "appear-class=''. Expects: string."
},
"enter-to-class": {
"prefix": "enterToClass",
"body": [
"enter-to-class=\"$1\"$0"
],
"description": "enter-to-class=''. Expects: string."
},
"leave-to-class": {
"prefix": "leaveToClass",
"body": [
"leave-to-class=\"$1\"$0"
],
"description": "leave-to-class=''. Expects: string."
},
"appear-to-class": {
"prefix": "appearToClass",
"body": [
"appear-to-class=\"$1\"$0"
],
"description": "appear-to-class=''. Expects: string."
},
"enter-active-class": {
"prefix": "enterActiveClass",
"body": [
"enter-active-class=\"$1\"$0"
],
"description": "enter-active-class=''. Expects: string."
},
"leave-active-class": {
"prefix": "leaveActiveClass",
"body": [
"leave-active-class=\"$1\"$0"
],
"description": "leave-active-class=''. Expects: string."
},
"appear-active-class": {
"prefix": "appearActiveClass",
"body": [
"appear-active-class=\"$1\"$0"
],
"description": "appear-active-class=''. Expects: string."
},
"before-enter": {
"prefix": "beforeEnterEvent",
"body": [
"@before-enter=\"$1\"$0"
],
"description": "@before-enter=''"
},
"before-leave": {
"prefix": "beforeLeaveEvent",
"body": [
"@before-leave=\"$1\"$0"
],
"description": "@before-leave=''"
},
"before-appear": {
"prefix": "beforeAppearEvent",
"body": [
"@before-appear=\"$1\"$0"
],
"description": "@before-appear=''"
},
"enter": {
"prefix": "enterEvent",
"body": [
"@enter=\"$1\"$0"
],
"description": "@enter=''"
},
"leave": {
"prefix": "leaveEvent",
"body": [
"@leave=\"$1\"$0"
],
"description": "@leave=''"
},
"appear": {
"prefix": "appearEvent",
"body": [
"@appear=\"$1\"$0"
],
"description": "@appear=''"
},
"after-enter": {
"prefix": "afterEnterEvent",
"body": [
"@after-enter=\"$1\"$0"
],
"description": "@after-enter=''"
},
"after-leave": {
"prefix": "afterLeaveEvent",
"body": [
"@after-leave=\"$1\"$0"
],
"description": "@after-leave=''"
},
"after-appear": {
"prefix": "afterAppearEvent",
"body": [
"@after-appear=\"$1\"$0"
],
"description": "@after-appear=''"
},
"enter-cancelled": {
"prefix": "enterCancelledEvent",
"body": [
"@enter-cancelled=\"$1\"$0"
],
"description": "@enter-cancelled=''"
},
"leave-cancelled": {
"prefix": "leaveCancelledEvent",
"body": [
"@leave-cancelled=\"$1\"$0"
],
"description": "@leave-cancelled='' (v-show only)"
},
"appear-cancelled": {
"prefix": "appearCancelledEvent",
"body": [
"@appear-cancelled=\"$1\"$0"
],
"description": "@appear-cancelled=''"
},
"routerLink": {
"prefix": "routerLink",
"body": [
"<router-link $1>$2</router-link>$0"
],
"description": "router-link element"
},
"routerLinkTo": {
"prefix": "routerLinkTo",
"body": [
"<router-link to=\"$1\">$2</router-link>$0"
],
"description": "<router-link to=''></router-link>. router-link element"
},
"to": {
"prefix": "to",
"body": [
"to=\"$1\"$0"
],
"description": "to=''"
},
"tag": {
"prefix": "tag",
"body": [
"tag=\"$1\"$0"
],
"description": "tag=''"
},
"routerView": {
"prefix": "routerView",
"body": [
"<router-view>$1</router-view>$0"
],
"description": "router-view element"
},
"nuxt": {
"prefix": "nuxt",
"body": [
"<nuxt/>"
],
"description": "This component is used only in layouts to display the page components."
},
"nuxtChild": {
"prefix": "nuxtChild",
"body": [
"<nuxt-child $1/>$0"
],
"description": "This component is used for displaying the children components in a nested route."
},
"nuxtLink": {
"prefix": "nuxtLink",
"body": [
"<nuxt-link ${1|to,:to|}=\"$2\">$0</nuxt-link>"
],
"description": "This component is used to provide navigations between page components."
}
}