# vscode 小技巧

{
	"react class component": {
    "scope": "javascript,javascriptreact", // 代码片段作用域，表示代码片段作用的文件类型，javascriptreact 代表 .jsx 文件
		"prefix": "rcc", // 触发代码片段的字段
		"body": [
			"import React, { Component } from 'react';",
			"",
      "export default class ${1:${TM_FILENAME_BASE/^\\w/${0:/upcase}/}} extends Component {",
      // ${1:${TM_FILENAME_BASE/^\\w/${0:/upcase}/}} 将文件名作为 react 类名，并将第一个字母转为大写
      // ${1} 代表光标第一个指到位置，TM_FILENAME_BASE 代表文件名
			"\trender() {",
			"\t\treturn (",
    	"\t\t\t<div className=\"$2\">$3</div>", // $2和$3代表光标到的第二第三个位置
			"\t\t);",
			"\t}",
			"}",
			""
		],
		"description": "A react function component."
	}
}