6. Data Processing

state={

datas:['A','B','C',

data:''

}

 

state 기반 Array 형태 데이터 추가

Ex)

hadleInsert=()=>{

this.setState({

datas: this.state.datas.concat(this.state.data),

data:''

}

)

}

 

state 기반 Array 형태 데이터 삭제

handleRemove=(index)=>{

const {datas} = this.state;

this.setState({

dates:[

...datas.slice(0,index),

...datas.slice(index+1, datas.length)

]

}

)

}

const list = this.satae.data.map(

(data, index)=>(

<li key={index} onClick={()=>this.handleRemove(index)>

{data}

</li>

)

}

ES6 적용

this.state.datas.slice(0,index).concat(this.state.datas.slice(index+1,this.state.length))

 

filter 함수

- 배열의 특정 조건 만족 값만 추출 후 새로운 배열 생성

Ex)

const {datas} = this.state;

this.setState({

datas:data.filter((item,i)=>i!==index)

}

)

}