摘要：
第二，在编写jsx这样的标记时，您不仅可以使用html的一些标记，例如div、span和p。在jsx语法中，如果我们想使用自己创建的组件，我们可以使用我们直接以该标记的形式定义的组件名称。jsx中不支持小写。在jsx中，如果要使用自己的组件，该组件必须以大写字母开头。所以总的感觉是大写标签是组件，小写标签通常是h5标签。如何以这种方式在jsx中编写注释｛/*comments*/｝需要一个大括号。
import React, { Component } from 'react';
class App extends Component {
render() {
return (
<div className="App">
hello world
</div>
);
}
}
export default App;比如App.js这个文件中，之前我们<div></div>一般都是在html文件中写的，现在我们把这样的标签写在了js文件中，所以我们是在js里面去写html标签，在react中，我们把在js文件中写的这种标签就叫做jsx语法，在react之中,jsx语法与普通的js语法有些区别
最直观的感受就是以前如果我们写普通的js语法，想要渲染一段html文本的话，一般会去返回一个字符串，比如
return '<div className="App">hello world</div>'
那如果这么去写，我们去运行我们的代码，发现展现出来的就是<div className="App">hello world</div>。
第二点，在jsx这种标签的写法之中，不仅仅可以用html的一些标签，比如说div,span,p。我们还可以使用自己定义的一些标签，比如<App/>。
在jsx语法中，如果我们要使用自己创建的组件，我们直接通过这种标签的形式使用我们定义的组件名就可以了。
这里有一点要注意，就是不能把开头的写成小写的，要大写。小写在jsx里面是不支持的。在jsx里面，如果要使用自己的组件，组件的开头必须以大写字母开头，所以整体的感觉就是看到大写的标签就是组件，小写的一般就是h5标签。
如何再jsx里面去编写注释
{/* 注释 */}这样写，需要通过一个花括号去写。这个只对开发有用，不会在页面上展现的
{ // 单行注释 }
这是单行的注释，大括号需要换行
jsx里面的样式
不能用class，会认为是个类，所以引用样式需要用className来代替class，这样就是react里标准的写法
如果通过输入框里面的标签，不想通过转义怎么弄，比如<h1>hello</h1>
<li key={index} onClick = {this.handleItemDelete.bind(this, index)} dangerouslySetInnerHTML={{__html: item}} > </li>
dangerouslySetInnerHTML,危险的设置，可能会被攻击
在html里面label的作用是扩大点击区域
<div>
<label for='inputSet'>输入内容：</label>
<input
id = 'inputSet'
className = 'input'
value = {this.state.inputValue}
onChange = {this.handleInputChange.bind(this)}/>
<button onClick = {this.handleBtnClick.bind(this)}> 提交 </button>
</div>我们可以看到，点击输入内容的时候，光标会自动的进入input框，虽然没什么问题，但打开控制台会报错，推荐我们使用htmlFor，在react中，这个for会认为是循环的for
<div>
<label htmlFor='inputSet'>输入内容：</label>
<input
id = 'inputSet'
className = 'input'
value = {this.state.inputValue}
onChange = {this.handleInputChange.bind(this)}/>
<button onClick = {this.handleBtnClick.bind(this)}> 提交 </button>
</div>