前端-Vue-html代码片段

设置—>用户代码片段—>新建全局代码片段

html代码片段

{
"Html5-Vue": { //模板名称
"prefix": "hv",//触发条件
"body": [//内容
"<!--",
"* @description ${1:参数1}",
"* @fileName ${TM_FILENAME_BASE}",
"* @author userName",
"* @date ${CURRENT_YEAR}-${CURRENT_MONTH}-${CURRENT_DATE} ${CURRENT_HOUR}:${CURRENT_MINUTE}:${CURRENT_SECOND}",
"* @version V1.0.0",
"!-->",
"<!DOCTYPE html>",
"<html lang=\"zh-CN\">\n",
"<head>",
"\t<meta charset=\"UTF-8\">",
"\t<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">",
"\t<meta http-equiv=\"X-UA-Compatible\" content=\"ie=edge\">",
"\t<title>${TM_FILENAME_BASE}</title>",
"\t<script src=\"https://cdn.jsdelivr.net/npm/vue/dist/vue.js\"></script>",
"</head>\n",
"<body>",
"\t<div id=\"app\">$1</div>\n",
"\t<script>",
"\t\tvar vm = new Vue({",
"\t\t\tel: '#app',",
"\t\t\tdata() {",
"\t\t\t\treturn {",
"",
"\t\t\t\t}",
"\t\t\t},",
"\t\t\tcreated()\t{ // 实例被创建之后执行代码",
"",
"\t\t\t},",
"\t\t\tcomputed: { // 计算属性",
"",
"\t\t\t},",
"\t\t\tcomponents: { // 组件的引用",
"",
"\t\t\t},",
"\t\t\tmethods: { // 方法",
"",
"\t\t\t},",
"\t\t\tmounted()\t{ // 页面进入时加载内容",
"",
"\t\t\t},",
"\t\t\twatch: { // 监测变化",
"",
"\t\t\t}",
"\t\t});",
"",
"\t</script>",
"</body>\n",
"</html>"
],
"description": "快速创建在html5编写的vue模板"//描述
}
}

html文件输入 hv 回车键可以生成html模版

©️2020 CSDN 皮肤主题: 数字20 设计师:CSDN官方博客 返回首页