JSX的使用
JSX嵌入变量
情况一：当变量是Number ，String，Array类型时，可以直接显示。
情况二：当变量是null，undefined，boolean时，内容为空。
- 若希望显示，则需要转成字符串；
- 转换方式：toString，和“”空字符串拼接，String(变量)等方式；
情况三：对象类型不能作为子元素(not valid as a React child)
JSX对象结构语法
- 在render中将state内属性解构，const { title, imgUrl } = this.state; 之后return显示渲染元素时可以直接引用
JSX嵌入表达式
- 运算表达式
- 三元运算符
- 执行一个函数
JSX绑定属性
- js代码写在大括号{}中
普通属性
- 元素都会有title属性：增加title属性后，鼠标移到内容上会有相应title值显示。可以在state中加入title属性，相应设置元素写为"title={this.stage.title}"
-
(常见)img元素都会有src属性，常见情况为：网络请求 -> 服务器请求数据 -> 拿到数据放到state -> 元素调用state。可以本地设置src的大小
image.png - (功能需求)a元素可以有href属性
class属性
-
(开发常用)元素动态绑定class，写作className ="box title"。开发中元素的类不能暂时确定。开发中有些类需要动态变化(js)，className以{}字符串赋值形式。
image.png 如上同理，label元素中for写为htmlFor。
()原生使用内联样式style，第一个大括号表示要潜逃js代码。第二个大括号表示要放置对象，其中直接值需要“”字符串，不加“”表示变量。
这里注意一点，在html中多个单词需要用-来连接font-size。在js中也用驼峰标识fontSize，或者加引号“font-size”
<div style={{color: "red", fontSize: "50px"}}>我是div，绑定style属性</div>
