Visual Studio Code 添加设置代码段

Visual Studio Code 添加设置代码段(snippet)

最近在写vue商城项目的时候，发现老师自己在VScode添加了一些的代码块非常方便，本筹划多码多练的我，在反抗不住诱惑设置后发现。。。真香！

1.       addFormRules: {        goods_name: [          { required: true, message: '请输入商品名称', trigger: 'blur' } //使这段酿成插入代码块        ]

复制代码

1、首先可以打开一个vue大概js的文件(或在当前打开文件中)按快捷键Ctrl+Shift+P打开下令输入 snippet :

2、选择你需要给哪种语言创建代码块，这里是在vue文件，在script脚本中创建，所以选择js。
接下来会打开一个JSON格式的设置文件，我们来看一下example:

1. {        // Place your snippets for javascript 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:        // "Print to console": {        //         "prefix": "log",        //         "body": [        //                 "console.log('$1');",        //                 "$2"        //         ],        //         "description": "Log output to console"        // }}

复制代码

参数表明：

  prefix :这个参数是使用代码段的快捷入口，比如例子中的log在使用时输入log会有智能感知。
body :这个是代码段的主体。需要设置的代码放在这里，字符串间换行的话使用\r\n换行符隔开。如果值里包罗特殊字符注意需要举行转义。
$1 :智能生成后为光标的所在位置。
$2 :这个参数后会光标的下一位置将会另起一行，按tab键可举行快速切换,还可以有$3,$4,$5…
description :在使用智能感知时代码段的形貌。

3.接下来我们设置依葫芦画瓢，设置自己所需的表单校验规则代码块：

1.         "Console required in form": {                "prefix": "reqiuredfield",                "body": [                        "{ required: true, message: '$1', trigger: 'blur' }"                ],                "description": "Add validation rules to the form"        }

复制代码

Ctrl+S生存后在vue文件中输入requiredfied按下tab就可以看到效果了。大抵输入req就能弹出智能提示：

之后增补用户没填表单后的提示信息就好啦。

来源：https://blog.csdn.net/weixin_44427092/article/details/112061119
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！