VS Code 自定义快捷输入
位置
ctrl+shift+p
- 搜索:
snippets
- 输入类型: 比如
html
、javascript
参数说明
-
prefix
:使用代码段的快捷入口 -
body
:需要设置的代码放在这里,字符串间换行的话使用\r\n换行符隔开.如果值里包含特殊字符需要进行转义,多行代码以","分隔(在引号后面写逗号) -
$0
:定义最终光标位置 -
$1
:定义第一次光标位置,按tab键可进行快速切换, 还可以有$2
,$3
,$4
,$5
... -
description
:代码段描述,在使用智能感知时的描述
常用字符说明
-
\\
反斜杠 -
\a
警告 -
\b
退格符 -
\f
换页符 -
\n
换行符 -
\r
回车符 -
\t
Tab 符 -
\v
垂直 Tab 符 -
\u
使用数字指定的Unicode 字符, 如\u2000
-
\x
使用十六进制数指定的Unicode 字符, 如\xc8
-
\0
空值
HTML
//自定义
"phone": {
"prefix": "ph",
"body": [
"<!DOCTYPE html>",
"<html lang='en'>",
"<head>",
" <meta charset='UTF-8'>",
" <meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'>",
" <meta name='viewport' content='width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0'/>",
" <title>Titile</title>",
"</head>",
"<body>",
"<script type='text/javascript'>",
" $('html').css({fontSize:$(window).width()/375*100 + 'px'});",
" $('body').css({minHeight:$(window).height()});",
"</script>",
"</body>",
"</html>"
],
"description": "script"
},
"script": {
"prefix": "sc",
"body": [
"<script type='text/javascript' src='$1'></script>"
],
"description": "script"
}
JavaScript
// 自定义
"function": {
"prefix": "fn",
"body": [
"function$1($2) {\r\n\t$3\r\n}"
],
"description": "function(){}"
},
"console.log": {
"prefix": "co",
"body": [
"console.log ($1);"
],
"description": "console.log()"
},
"alert": {
"prefix": "al",
"body": [
"alert ($1);"
],
"description": "alert()"
},
"class": {
"prefix": "cl",
"body": [
"$('.$1')"
],
"description": "class"
},
"id": {
"prefix": "id",
"body": [
"$('#$1')"
],
"description": "id"
},
"on": {
"prefix": "on",
"body": [
"on ('click',function () {\r\n\t$1\r\n})"
],
"description": "on"
},
"for": {
"prefix": "fo",
"body": [
"for (let i = 0; i < $1; i++) {\r\n\t$2\r\n}"
],
"description": "for"
},
"if": {
"prefix": "ifif",
"body": [
"if ($1) {\r\n\t$2\r\n}"
],
"description": "if"
},
"ifElse": {
"prefix": "ifel",
"body": [
"if ($1) {\r\n\t$2\r\n} else {\r\n\t$3\r\n}"
],
"description": "ifElse"
},
"ajax": {
"prefix": "aj",
"body": [
// "$.ajax({\r\n\turl:$1,\r\n\tdata:{\r\n\t\t$2\r\n\t},\r\n\ttype:'post',\r\n\tdataType:'JSON',\r\n\tsuccess:function (res) {\r\n\t\t$3\r\n\t}\r\n})"
"$.ajax({",
" url: $1,",
" data:{",
" $2",
" },",
" type: 'post',",
" dataType: 'JSON',",
" success:function (res) {",
" $3",
" }",
"})"
],
"description": "ajax"
},
"axios": {
"prefix": "ax",
"body": [
"axios.$1(__PROJECTPATH__ + `$2`, {",
" $3",
"})",
".then(function (response) {",
" console.log(response);",
"})",
".catch(function (error) {",
" console.log(error);",
"});",
],
"description": "axios"
}
Vue
注: 组件/实例的书写顺序参照 Vue 风格指南
// 自定义(移动端)
"vue": {
"prefix": "vu",
"body": [
"<!-- $1 -->",
"<template>",
" <div>",
" $2",
" </div>",
"</template>",
"",
"<script>",
" export default {",
" name: '',",
" components: {",
" ",
" },",
" props: {",
" ",
" },",
" data() {",
" return {",
" ",
" }",
" },",
" computed: {",
" ",
" },",
" watch: {",
" ",
" },",
" created() {",
" ",
" },",
" methods: {",
" ",
" }",
" }",
"</script>",
"",
"<style scoped lang='less'>",
" ",
"</style>"
],
"description": "Vue templet"
}

低调大师中文资讯倾力打造互联网数据资讯、行业资源、电子商务、移动互联网、网络营销平台。
持续更新报道IT业界、互联网、市场资讯、驱动更新,是最及时权威的产业资讯及硬件资讯报道平台。
转载内容版权归作者及来源网站所有,本站原创内容转载请注明来源。
-
上一篇
Node.js 8
编者:本文作者孝达,经作者允许,刊载于 Alinode 团队博客。未经允许,不得转载。 端午节结束了。虽然接下来的四个月都没有节假日,但笔者一点都不烦恼。因为 Node.js 8 在端午后第一个工作日就正式发布,这足以让我与 Node.js 的激情燃烧一个夏天!本文挑选了笔者认为 Node.js 8 最令人兴奋的四大新功能,与大家分享。 async/await 与 util.promisify Node.js 一直以来的关键设计就是把用户关在一个“异步编程的监狱”里,以换取非阻塞 I/O 的高性能,让用户轻易开发出高度可扩展的网络服务器。这从 Node.js 的 API 设计上就可见一斑,很多API——如 fs.open(path, flags[, mode], callback)——要求用户必须把该操作执行成功后的逻辑放在最后参数里,
-
下一篇
杨老师课堂_Java核心技术下之控制台模拟记事本案例
预览效果图: 背景介绍: 编写一个模拟记事本的程序通过在控制台输入指令,实现在本地新建文件打开文件和修改文件等功能。 要求在程序中: 用户输入指令1代表“新建文件”,此时可以从控制台获取用户输入的文件内容; 指令2代表打开文件,此时可将指定路径的txt文件的内容展现到控制台, 指令3代表修改文件,此时即可以修改新建文件的内容,也可以修改打开文件的内容; 指令4代表保存,此时如果是新建的文件需要保存,则将文件保存到用户输入的路径,如果是打开的文件需要保存,则将原来内容覆盖; 指令5代表退出系退出本系统,例如输入指令1之后输入内容再输入指令4和文件保存的路径,此时可将输入内容保存至指定的路径。 输入指令2之后,输入想要查看的文件的路径,在输入指令3以及要修改内容,再输入指令4,此时完成指定路径下的文件的修改. 示例代码: import java.io.FileReader; import java.io.FileWriter; import java.io.IOException; import java.util.Scanner; import org.junit.Test; /** ...
相关文章
文章评论
共有0条评论来说两句吧...