如何在VSCode中快速切换块式和表达式式箭头函数

Question

我的设置：

• VS代码
• eslint的arrow-body-style设置为always
• VSCode eslint 扩展配置为自动修复错误

我试图解决的问题是在块和表达式样式箭头函数之间切换很麻烦。这是一个比较：

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

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

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

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

我真正喜欢的是一个扩展，它可以让我通过快捷方式在两种形式之间切换（也许有一个我还没有找到，或者我应该写一个！）。这是我的问题：

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

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

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

Answer 1

此操作有内置的重构。

将光标放在=和之间>。将会出现一个灯泡。
单击灯泡并选择Add braces to arrow function.

做同样的事情并选择Remove braces from arrow function将会以相反的方式返回。