一个专为 React/TypeScript 开发者设计的 VS Code 快捷插件。通过简单的逗号分隔输入，智能、快速地生成带有类型推导和驼峰命名转换的 useState 样板代码。
功能特点 (Features)
- 智能命名转换：输入空格分隔的名称（如
login modal），自动转换为小驼峰变量名loginModal以及大驼峰 Setter 函数setLoginModal。 - 智能类型推导：支持省略类型，根据初始值自动推导
boolean、number、string等基础类型。 - 复杂类型支持：完美支持自定义 Interface、泛型以及联合类型（如
DataInterface | null）。
使用方法 (Usage)
- 在
.tsx或.jsx文件中，将光标移动到想要插入代码的位置。 - 按下
F1（或Ctrl+Shift+P/Cmd+Shift+P）打开命令面板。 - 输入并选择
Create React useState。 - 在弹出的输入框中按照以下格式输入并回车：
示例 1：基础自动类型推导
- 输入:
login modal, false - 生成:
const [loginModal, setLoginModal] = useState<boolean>(false);
示例 2：显式指定接口类型与 Null 默认值
- 输入:
data, DataInterface, null - 生成:
const [data, setData] = useState<DataInterface | null>(null);
示例 3：数组与自定义类型
- 输入:
data list, DI[], [] - 生成:
const [dataList, setDataList] = useState<DI[]>([]);
快捷键配置 (Optional)
如果你觉得每次按 F1 太麻烦，可以在 VS Code 的 keybindings.json 中为其绑定快捷键。例如绑定为 Ctrl+Alt+S：
{
"key": "ctrl+alt+s",
"command": "react-usestate-quick-create.createState",
"when": "editorTextFocus"
}