vscode 常用代码片段整理
目录1、js2、react3、vue1、js{"console.log": {"prefix": "ccg","body": ["console.log($1, '=====$2')",]},"debugger": {"prefix": "ddg","body": ["console.log($1, '=====$2')","debugger"]},"if": {"prefix": "iif",
·
目录
使用方法:
- js部分在.js文件中生效;
- react部分在.jsx文件中生效;
- vue部分在.vue文件中生效;
- prefix 代码简写字符,body代表生成代码的全部,$1,$2代表代码生成后,光标自动所在的位置,按顺序,按tab键可以依次进行设置;
以console.log为例,例如:
输入 ccg, 按tab键,自动生成console.log(xx, '=====xx')
1、js
{
"console.log": {
"prefix": "ccg",
"body": [
"console.log($1, '=====$2')",
]
},
"debugger": {
"prefix": "ddg",
"body": [
"console.log($1, '=====$2')",
"debugger"
]
},
"if": {
"prefix": "iif",
"body": [
"if ($1) {",
" $2",
"}"
]
},
"else if": {
"prefix": "eef",
"body": [
"else if ($1) {",
" $2",
"}"
]
},
"else": {
"prefix": "eee",
"body": [
"else {",
" $2",
"}"
]
},
"map": {
"prefix": "mmp",
"body": [
"$1.map((item, idx) => {",
" $2",
" return $3",
"})"
]
},
"forEach": {
"prefix": "ffh",
"body": [
"$1.forEach((item, idx) => {",
" $2",
"})"
]
},
"find": {
"prefix": "ffd",
"body": [
"const $1 = $2.find(item => $3)"
]
},
"switch": {
"prefix": "ssh",
"body": [
"switch($1) {",
" case $2:",
" return $3",
" case $4:",
" return $5",
" case $6:",
" return $7",
" case $8:",
" return $9",
" default:",
" return null",
"}"
]
},
"import": {
"prefix": "iit",
"body": [
"import $1 from '$2'"
]
},
"const": {
"prefix": "cct",
"body": [
"const $1 = $2"
]
},
"let": {
"prefix": "llt",
"body": [
"let $1 = $2"
]
},
// "function": {
// "prefix": "ffn",
// "body": [
// "const $1 = ($2) => {",
// " $3",
// " return $4",
// "}"
// ]
// },
// "className": {
// "prefix": "cname",
// "body": [
// "className={$1}"
// ]
// },
// "onClick": {
// "prefix": "ook",
// "body": [
// "onClick={$1}"
// ]
// },
// "useEffect": {
// "prefix": "uuk",
// "body": [
// "useEffect(() => {",
// " $1",
// "}, [$2])"
// ]
// },
// "useState": {
// "prefix": "uue",
// "body": [
// "const [$1, set$2$1] = useState($3)"
// ]
// },
// "index.jsx": {
// "prefix": "iix",
// "body": [
// "import React from 'react'",
// "",
// "const $1 = () => (",
// " <div className={$1}>",
// " $3",
// " </div>",
// ")",
// "",
// "export default $1",
// ]
// },
}
2、react
{
"console.log": {
"prefix": "ccg",
"body": [
"console.log($1, '=====$2')",
]
},
"debugger": {
"prefix": "ddg",
"body": [
"console.log($1, '=====$2')",
"debugger"
]
},
"if": {
"prefix": "iif",
"body": [
"if ($1) {",
" $2",
"}"
]
},
"else if": {
"prefix": "eef",
"body": [
"else if ($1) {",
" $2",
"}"
]
},
"else": {
"prefix": "eee",
"body": [
"else {",
" $2",
"}"
]
},
"map": {
"prefix": "mmp",
"body": [
"$1.map((item, idx) => {",
" $2",
" return $3",
"})"
]
},
"forEach": {
"prefix": "ffh",
"body": [
"$1.forEach((item, idx) => {",
" $2",
"})"
]
},
"find": {
"prefix": "ffd",
"body": [
"const $1 = $2.find(item => $3)"
]
},
"switch": {
"prefix": "ssh",
"body": [
"switch($1) {",
" case $2:",
" return $3",
" case $4:",
" return $5",
" case $6:",
" return $7",
" case $8:",
" return $9",
" default:",
" return null",
"}"
]
},
"function": {
"prefix": "ffn",
"body": [
"const $1 = ($2) => {",
" $3",
" return $4",
"}"
]
},
"import": {
"prefix": "iit",
"body": [
"import $1 from '$2'"
]
},
"const": {
"prefix": "cct",
"body": [
"const $1 = $2"
]
},
"let": {
"prefix": "llt",
"body": [
"let $1 = $2"
]
},
"className": {
"prefix": "cname",
"body": [
"className={$1}"
]
},
"onClick": {
"prefix": "ook",
"body": [
"onClick={$1}"
]
},
"useEffect": {
"prefix": "uuk",
"body": [
"useEffect(() => {",
" $1",
"}, [$2])"
]
},
"useState": {
"prefix": "uue",
"body": [
"const [$1, set$2$1] = useState($3)"
]
},
"index.jsx": {
"prefix": "react",
"body": [
"import React from 'react'\n",
"const $1 = () => {",
" return (",
" <div className={$1}>",
" $3",
" </div>",
" )",
"}\n",
"export default $1",
]
},
}
3、vue
{
"index.vue": {
"prefix": "vue",
"body": [
"<template>",
" <div>",
" $1",
" </div>",
"</template>\n",
"<script>",
"export default {",
" name: $2,",
" components: {},",
" props: {},",
" data() {",
" return {}",
" },",
" created() {},",
" mounted() {},",
" methods: {}",
"};",
"</script>\n",
"<style scoped lang=\"less\">\n",
"</style>\n",
],
"description": "Create vue template"
},
"function": {
"prefix": "ffn",
"body": [
"$1 () {",
" $2",
"}"
],
},
"@click": {
"prefix": "cck",
"body": [
"@click=\"$1\"",
],
},
"@v-for": {
"prefix": "vvr",
"body": [
"v-for=\"(item, idx) in $1\" :key=\"idx\"",
],
},
"@v-if": {
"prefix": "vvf",
"body": [
"v-if=\"$1\"",
],
},
"class": {
"prefix": "ccs",
"body": [
"class=\"$1\"",
],
},
"watch": {
"prefix": "wwh",
"body": [
"watch: {",
" $1 () {",
" $2",
" }",
"},",
],
},
"computed": {
"prefix": "ccd",
"body": [
"computed: {",
" $1 () {",
" return $2",
" }",
"},",
],
},
"props": {
"prefix": "pps",
"body": [
"props: {",
" $1: {",
" type: $2",
" default: $3",
" }",
"},",
],
},
}
更多推荐
已为社区贡献2条内容
所有评论(0)