Visual Studio code 添加多个vue代码片段或JavaScript方法片段

vue代码片段和JavaScript片段添加方法类似；vue代码片段在vue.json下添加，JavaScript方法片段在javascript.json文件下添加（在用户代码片段内搜索此文件）；以添加vue代码片段为例：

一.添加vue模板代码片段：

1.找到VS code编辑器文件下的首选项里面用户代码片段，如图：

2.选择vue.json，进入此文件下创建自己的模板，如下：

在vue.json文件下，编写模板：

{
	// Place your snippets for vue here. Each snippet is defined under a snippet name and has a prefix, body and 
	// description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
	// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the 
	// same ids are connected.
	// Example:
	"vue1": {//vue1:模板标识一（不可重复）
        "prefix": "vue",//自定义模板名称；
        "body": [
            "<template>",
			"\t<el-row  class=\"mainTableBox\">\n",
            "\t</el-row>",
            "</template>\n",
            "<script>",
            "\texport default {",
            "\t\tdata () {",
			"\t\t\treturn {",
			"\t\t\t\trow:[],",
			"\t\t\t\tloading:false,",
			"\t\t\t\tpageIndex:1,//当前页码",
			"\t\t\t\ttotalCounts:1,//总页数",
            "\t\t\t}",
            "\t\t},",
			"\t\tmounted() {",
			"\t\t\tthis.init();",
            "\t\t}",
			"\t\tmethods: {\n",
			"\t\t\tinit(){\n",
			"\t\t\t},",
			"\t\t\tadd(){\n",
			"\t\t\t},",
			"\t\t\tedit(){\n",
			"\t\t\t},",
            "\t\t}",
            "\t\tcomputed: {\n",
            "\t\t}",
            "\t\twatch: {\n",
            "\t\t}",
            "\t}",
            "</script>\n",
            "<style>\n",
            " ",
            "</style>",
        ],
        "description": "vue基础代码片段"
	},
	"vue2": {//vue2：模板标识二（不可重复）
		 "prefix": "vue2",//自定义模板名称；
		 "body": [
			     "console.log('$1');",
	 		     "$2"
		 ],
	     "description": "Log output to console"
	}
}

3.使用：在.vue文件下输入vue时，按回车键或tab

结果如下：