코딩애플_많은 div 줄이기,map()

반복문 code

let [title, titleFunction] = useState(['React','HTML','CSS']);



{
   title.map(function(index){
      return(
        <div className='list'>글제목
        <h3>{index}</h3>
        <p>2월 17일 발행</p>
        <hr/>      
        </div> 
      )
   })
}

반복문 code

{
   title.map(function(index){
      return(
        <div className='list'>글제목
        <h3>{index}</h3>
        <p>2월 17일 발행</p>
        <hr/>      
        </div> 
      )
   })
}

• title 의 제목만큼 반복하고 싶으므로 title 배열에 map 함수를 적용한다.

• 반복되는 내용마다 제목을 다르게 하고 싶으므로 임의로 index 를 적어준다.

• title 배열의 길이는 3 이므로 3번 반복하게 된다.

function app(){
...
...

function titleRepeat() {
    let newArr=[];
    
    for (i=0; i <3; i++){
      newArr.push(<div>hello</div>)	
    }
    
    return newArr
}
...
...
return (
...
...
{ titleRepeat() }  // 출력하고자 하는 곳에 넣어준다.
)

• 정식 반복문