提升开发效率的方法——代码片段

前言

实际开发中，我们总会写很多固定格式的代码，每次遇到了都自己去敲，或者回去cv都会消耗一定的时间，降低我们的开发效率，这时候我们可以通过创建代码片段来快速生成，提高我们的开发效率。

如何创建代码片段

点击vscode中的设置按钮，选择用户代码片段，再选择新建全局代码片段文件，输入你想要取的片段名后点击enter，显示代码片段编辑区。

这个是我自己用的代码片段：

{
	"try catch async await": {
		"scope": "javascript,typescript",
		"prefix": "api", // 快捷键 + tab
		"body": [
			"async $1(){",
      "import { $2 } from '@/api/${4}'",
      "  try {",
      "    const res = await $2($3)",
      "    console.log('$2', res)",
      "    ${5}// 保存数据",
      "  } catch (err) {",
      "    console.log('$2', err)",
      "  }",
			"},"
		],
		"description": "飞起来的async await"
	}
}

{
	"try catch async await": {
		"scope": "javascript,typescript",
		"prefix": "confirm", // 快捷键 + tab
		"body": [
			"this.$confirm('此操作将永久删除该角色, 是否继续?', '提示', {",
				"confirmButtonText: '确定',",
				"cancelButtonText: '取消',",
				"type: 'warning'",
			  "}).then(() => {",
				"this.doDel($1)",
			  "}).catch((err) => {",
				"console.log(err)",
				"this.$message({",
				  "type: 'info',",
				  "message: '已取消删除'",
				"})",
			 " })"
		],
		"description": "飞起来的confirm"
	}
}

创建完成后鼠标定位在1,点击tab键可以切换到1,点击tab键可以切换到2,同理点击tab键可以切换到334，同时注意一下body中片段的书写格式。

如何使用代码片段

在敲代码的时候键入你自己取的片段名 + enter就可以快速生成了

如何删除

最后

希望整理的信息对您有所帮助,喜欢的话请帮忙点赞

如果有什么建议,欢迎在评论区留言

不足之处还请批评指教,谢谢!