VSCode的一些小操作(五)——自定义代码片段

在我们敲代码的时候,有一些代码出现频率特别的高,就比如for循环,很多地方都会用到,再比如document.querySelector(’’) 这个用来获取元素特别的方便,也是经常用,但是我们敲这类代码的时候,每次都要敲那一坨几乎一样的东西。

如果我们能把这一坨代码和我们的编辑器事先说好,然后每次按某些的定的键就可以生成对应的那坨代码的话,那将会提高我们敲代码的效率。
那么,开始今天的正题

VSCode自定义代码片段的方法:

首先按F1打开命令面板(如果你的F1被某些东西占用的的话,按Ctrl+Shift+P也可以)

在命令面板中输入 “配置用户代码片段” 然后回车,选择你要自定义代码片段的语言

在这里插入图片描述

选完之后VSCode会帮你创建一个json文件,如果你不会写json也没关系,VSCode连例子都帮我们写好了

在这里插入图片描述

然后我们就可以仿照它给的例子写了,每坨自定义的代码片段都由三个部分组成,他们对应的作用如图所示:

在这里插入图片描述

写好之后,我们就可以使用它了:

在这里插入图片描述
然后就又产生了一个问题,每次生成的代码都是固定的,不灵活,就比如我这个for循环,并不是每次的变量都是i,并不是的范围都是到 n,并不是每次里面都要log一下i

我们需要在生成这些代码时候可以顺便的修改这段代码里面的东西

这个问题也不难解决,我们只需要这样:

在这里插入图片描述
生成之后光标会停在$1的位置,就可以再这个位置输一些东西,按TAB键,光标会跳到下一个$上,$后面的数字代表了TAB跳转的顺序,$后面数字一样的会在改动的时候同时做出改变,如果发现有的地方输错了,想要跳回到上一个位置,那么只需要按住Shift再按TAB就可以跳到上一个位置了。当用TAB跳完所有$的位置之后再按TAB,光标就会跳转到生成的代码片段的最后面。

虽然每次都可以手动修改代码片段中某些东西,但是有些东西在一般情况下是不需要修改的,只有在某些时候才需要修改,就比如我这个for循环,虽然不是每次变量都是i并不是每次范围都到n,但是在大多数情况下是这样的,这时我们就可以给这个$1,$2这些东西

附上默认值:

在这里插入图片描述

这样当我们需要改的时候改它,不需要改的时候直接一路TAB过去就行了

哦对了,有件事情忘了说,就是这个东西
在这里插入图片描述
这个名字并没有什么用,怎么随便改都可以

以上


ヾ(≧∪≦*)ノ〃

猜你喜欢

转载自blog.csdn.net/ycx60rzvvbj/article/details/106607039