如何在 JetBrains IDE 中创建实时模板以在 React 中创建挂钩状态？

Question

我想创建一个实时模板，例如在 PyCharm 中使用 React hooks 快速添加一个新的状态变量。

我想我得到了接近我想要的东西（包括 TypeScript 的状态类型）：

const [$1$, set$1$] = useState<$2$>($3$);
$END$

但是以

count

为例，我仍然必须将函数

setcount

重命名为 CamelCase，因为我得到：

const [count, setcount] = useState<number>(0);

Answer 1

1. 避免使用数字作为变量名，使用专有名称。阅读和参考它们更容易。

2. 为

   set$1$

   引入另一个变量，例如

   set$NAME2$

   .

3. 然后在

   Edit variables

   屏幕上，对于那个新的

   NAME2

   变量，只需引用原始变量并与

   capitalize()

   函数一起使用。 https://www.jetbrains.com/help/webstorm/template-variables.html#configure_template_variables

这样，将使用（转换）中间

$NAME2$

变量，但您不会手动填充它，一旦展开实时模板，在编辑点之间跳转时将跳过它。

const [$NAME$, set$NAME2$] = useState<$TYPE$>($VAL$);
$END$

（当然要使用适当的缩写/描述）