VSX中的JSX组件（功能）自动完成？

Question

VS Code中是否有特殊的自动完成键或键序列，可以在键入以下内容后快速为组件创建骨架函数？

function [FunctionName]  

将产生以下结果：

function [FunctionName] (){  
  return();  
}

我正在观看PluralSight培训视频，而作者只是键入了“ function [FunctionName]”，然后他以某种方式触发了自动完成功能，从而创建了其余的括号，包括return语句。我已经研究过片段，但是必须有一种更简单的方法...

Answer 1

有大量的vscode扩展可以完成此任务。这些被称为“代码段”，您可以找到大量的snippet extensions in the vscode extension marketplace。

一个例子是dsznajder的ES7 React/Redux/GraphQL/React-Native snippets扩展名。

该扩展名将允许您执行类似示例的操作，从而将nfn转换为const functionName = (params) => { }。

---

也要回答您的问题，您可以通过键入rce来生成组件的支架。

这将自动完成以下操作：

import React, { Component } from 'react'

export class FileName extends Component {
  render() {
    return <div>$2</div>
  }
}

export default $1