Java开发平台IntelliJ IDEA教程：与React集成（中）
IntelliJ IDEA是Java语言开发的集成环境，IntelliJ在业界被公认为优秀的Java开发工具之一，尤其在智能代码助手、代码自动提示、重构、J2EE支持、Ant、JUnit、CVS整合、代码审查、 创新的GUI设计等方面的功能可以说是超常的。
IntelliJ IDEA现已更新至2019.2版本，新版本改进了java13预览等20余项功能，提高了开发效率，赶快下载体验吧~（点击查看更新详情）
仅Ultimate Edition 支持此功能。
完成代码
IntelliJ IDEA 使用JavaScript代码为React API和JSX提供代码完成。代码完成适用于React方法，React特定的属性，HTML标记和组件名称， React事件，组件属性等。
为了获得React方法和特定于React的属性的代码完成，您需要在项目中的某个地方放置react.js库文件。通常，该库已经在您的node_modules文件夹中。
完成React方法，属性和事件
默认情况下，键入时会自动显示代码完成弹出窗口。例如：
在JSX标签中，IntelliJ IDEA为React特定的属性（例如className或classID）和非DOM属性（例如key或）提供编码帮助ref。此外，自动完成还适用于项目的CSS文件中定义的类的名称：
所有React事件（例如onClick或onChange）也可以与花括号一起自动完成 ={}：
完成还适用于花括号内的JavaScript表达式。这适用于您定义的所有方法和功能：
完成HTML标签和组件名称
IntelliJ IDEA为您在JavaScript的方法或其他组件内部定义的HTML标记和组件名称提供代码完成：
完成还适用于采用ES6样式语法的导入组件：
完成组件属性
IntelliJ IDEA为使用定义的组件属性提供代码完成propTypes并解析它们，因此您可以快速跳转或预览它们的定义：
当您自动完成组件的名称时，IntelliJ IDEA会自动添加其所有必需的属性。如果组件的使用中缺少某些必需的属性，则IntelliJ IDEA会警告您。
将HTML属性传输到JSX
当您复制一段HTML代码级的属性或事件处理程序并将其粘贴到JSX，IntelliJ IDEA的自动替换阵营特定的人，这些属性（className，onClick， onChange，等。）
要将HTML代码“按原样”复制到JSX，请使用Paste Simple Ctrl+Shift+Alt+V。
使用阵营代码片段
IntelliJ IDEA随附了50多个代码段的集合，这些代码段可扩展为React应用程序中经常使用的不同语句和代码块。下面的示例显示了如何使用rcjc缩写来创建定义新的React组件的类：
要创建一个片断一个阵营代码构造
在编辑器中键入所需的缩写，然后按Tab。
按下Ctrl+J并选择相关的代码段。要缩小搜索范围，请开始输入缩写，然后从完成列表中选择它。
查看所有可用React代码段的列表
借助IntelliJ IDEA，您不仅可以在HTML中使用Emmet，而且可以利用一些特殊的React扭曲在JSX代码中使用Emmet。例如，缩写div.my-class在JSX中扩展为，
在HTML中扩展为：
通过应用程序做出反应导航
除了基本导航之外，IntelliJ IDEA还可以帮助您在React特定的代码元素之间跳转。
要跳到花括号内的方法或JavaScript表达式的定义{}，请选择方法或表达式，然后按Ctrl+B。
要跳至组件的定义，请选择组件名称，然后按Ctrl+B。
要查看组件的文档，请按Ctrl+Shift+I。
IntelliJ IDEA使您可以使用面包屑和在编辑器装订线中标记树的彩色突出显示轻松浏览JSX标记：
=====================================================
IntelliJ IDEA示例/使用教程/视频资源合集，请点击此处查看
想要了解或购买IntelliJ IDEA正版授权的朋友，欢迎
关注下方微信公众号，及时获取产品最新消息和最新资讯
QQ交谈
在线咨询
渝公网安备
50010702500608号
客服热线