vsCode软件常用模板代码设置

 Vue模板代码块

{
	"vue_template": {
		"prefix": "vue",
		"body": [
			"<template>",
			"\t<div class=\"vue_template_wrapper\">",
			"\t\t",
			"\t</div>",
			"</template>",
			"<script>",
			"export default {",
			"\tdata() {",
			"\t\treturn{}",
			"\t},",
			"\tcreated() {",
			"\t},",
			"\tmounted() {",
			"\t},",
			"\tmethods:{",
			"\t}",
			"}",
			"</script>",
			"<style scoped>",
			".vue_template_wrapper {",
			"}",
			"</style>"
		],
		"description": "Vue模板代码"
	},
	"vue_template_css": {
		"prefix": "vue_css",
		"body": [
			"<template>",
			"\t<div class=\"vue_template_wrapper\">",
			"\t\t",
			"\t</div>",
			"</template>",
			"<script>",
			"export default {",
			"\tdata() {",
			"\t\treturn{}",
			"\t},",
			"\tcreated() {",
			"\t},",
			"\tmounted() {",
			"\t},",
			"\tmethods:{",
			"\t}",
			"}",
			"</script>",
			"<style lang='css' scoped>",
			".vue_template_wrapper {",
			"}",
			"</style>"
		],
		"description": "Vue普通css样式模板代码"
	},
	"vue_template_less": {
		"prefix": "vue_less",
		"body": [
			"<template>",
			"\t<div class=\"vue_template_wrapper\">",
			"\t\t",
			"\t</div>",
			"</template>",
			"<script>",
			"export default {",
			"\tdata() {",
			"\t\treturn{}",
			"\t},",
			"\tcreated() {",
			"\t},",
			"\tmounted() {",
			"\t},",
			"\tmethods:{",
			"\t}",
			"}",
			"</script>",
			"<style lang='less' scoped>",
			".vue_template_wrapper {",
			"}",
			"</style>"
		],
		"description": "Vue使用less样式模板代码"
	}
}

React模板代码块

{
	"react_template": {
		"prefix": "react",
		"body": [
			"import React, { FunctionComponent } from 'react';",
			"import styles from './index.less';\n",
			"interface IProps {\n",
			"}\n",
			"const Component: FunctionComponent<IProps> = (props) => {",
			"\tconst {\n",
			"\t} = props;\n",
			"\treturn (",
			"\t\t<div className={styles.react_template_wrapper}></div>",
			"\t);",
			"};\n",
			"export default Component;"
		],
		"description": "React模板代码"
	},
	"Print to state": {
		"prefix": "sta",
		"body": [
			"const [state, setState] = useState<any>();",
		],
		"description": "定义变量"
	},
    "Print to useEffect": {
		"prefix": "use",
		"body": [
			"useEffect(() => {\n",
			"}, []);"
		],
		"description": "定义变量"
	},
    "Print to setTimeout": {
		"prefix": "tim",
		"body": [
			"setTimeout(() => {\n",
			"}, 1000);",
		],
		"description": "打印日志模板代码"
	},
	"Print to setInterval": {
		"prefix": "int",
		"body": [
			"setInterval(() => {\n",
			"}, 1000);"
		],
		"description": "打印日志模板代码"
	},
	"Print to console": {
		"prefix": "log",
		"body": [
			"console.log('result:', );",
		],
		"description": "打印日志模板代码"
	}
}