React:设置key,实现部分render

    技术2022-07-13  77

    在state中增加id参数

    state={ persons:[ {id:'asfa1', name:'Max' , age:28}, {id:'asfa2', name:'manu' , age:24}, {id:'asfa3', name:'Snie' , age:26} ], isshow:false };

    为person设置key

    if(this.state.isshow){ person=( <div> { this.state.persons.map((person,index)=>{ return <Person name={person.name} age={person.age} click={this.deletePersonHandler.bind(this,index)} key={person.id} /> }) } </div> ); }else{ person=null; }

    key

    设置key后每次render都会比较前后版本,render不同的部分; 不然会render整个代码,效率降低;

    Processed: 0.018, SQL: 10