1. 条件渲染：

    if(布尔值){
    return(jsx)
}else{
    return (jsx)
}
条件是否成立&&模块显示隐藏
三目运算： 条件？模块：模块
注：阻止条件渲染时，不使用DOM内容情况下返回null，数据类型保持一致

  2. 列表渲染：使用map方法进行遍历

    react中无论后期列表是否进行变动，都需要给遍历的虚拟DOM加上唯一的key，否则控制台会抛出警告，一个元素的key最好是这个元素在列表中拥有的一个独一无二的<mark>字符串</mark>,万不得已可以使用元素索引index作为key，如果列表项目的顺序可能会变化，不建议使用索引来用作key值，<mark>因为这样做会导致性能变差，还可能引起组件状态的问题</mark>

  3. 受控组件：使React的state成为“唯一数据源”。渲染表单的React组件还控制着，用户输入过程中表单发生的操作。被React以这种方式控制取值的表单输入元素叫做“受控组件”，使用value值需要和onChange方法进行配合，否则控制台抛出警告，textarea和select的数据来源也需要使用value形式配合state中的值取使用

  4. Refs选取真实DOM

    • DOM行间 ref=‘属性名’ 使用时：this.refs.属性名

    • DOM行间 ref= {(ref)=>this.属性名=ref} 使用时：this.属性名

    • DOM行间 ref = {this.属性名} 需要在constructor下去创建,this.createRef(), 使用时,this.属性名.current

5.父传子：props

 <Child sendMsg={this.state.parentMsg}/>

6.子传父 ：

在子组件state中定义数据
在子组件方法中定义自定义事件
子组件调用处使用自定义事件触发父级中的方法
父级中的方法使用形参接收传递过来的数据

  1. 兄弟传值：把子组件A传给父组件的数据再使用props传递给子组件B

  2. 跨组件的数据双向绑定

    • 父组件定义数据，在子组件定义input需要去改动父组件中的数据

    • 把父组件的数据使用props传递给子组件，绑定到子组件input的value

    • input要变动数据需要使用onChange，改变父组件中的数据

    • 在父组件中定义方法，把方法通过props传递给子组件，子组件使用onChange调用

      父组件传递过来的方法去修改父组件的值

    • constructor(props)和this.props等价