javascript - 如何在 VSCode 中快速切换 block 和表达式样式的箭头函数

Question

我的设置:

VS码

eslint与 arrow-body-style设置为始终

VSCode eslint 扩展配置为自动修复错误

我要解决的问题是在 block 和表达式样式箭头函数之间切换很繁琐。这是一个比较:

// block style
const myBlockStyleArrowFn = () => {
  return {};
}

// expression style
const myExpressionStyleArrowFn = () => ({});

在许多情况下，我真的很喜欢速记表达风格，但是当需要扩展其中一个功能时，总是需要手动添加必要的大括号等。

更糟糕的是，如果我只是尝试更改，那么我发现 VSCode 将有助于将我的 block 样式箭头函数转换回表达式样式(我发现自己插入了多余的 console.log() 语句只是为了防止这种情况发生)。

我真正喜欢的是一个扩展，它让我可以使用快捷方式在两种形式之间切换(也许有一个我找不到，或者我应该写一个!)。这是我的问题:

在 VSCode 中两种形式的 JavaScript 箭头函数之间转换的最简单方法是什么？

我知道我可以关闭自动修复功能，但在 99% 的情况下它做得很好，所以我会在那里损失很多。

一如既往地感谢您的帮助。

Answer 1

此操作有一个内置的重构。
将光标放在 = 之间和 > .会出现一个灯泡。
单击灯泡并选择 Add braces to arrow function.
做同样的事情并选择Remove braces from arrow function会以另一种方式返回。