리액트 jsx 내 조건문

리액트 jsx 내 조건문

QA

리액트 jsx 내 조건문

본문

안녕하세요. 리액트 배우고 있는데 component 내에서, 조건문을 어떻게 써야할까요..? 계속 오류가 나네요..

return 문안의 map 함수 안에서 조건문으로 다른 것으로 출력을 하려는데, 뭐가 잘못된걸까요?..

조건문으로 selectbox와 checkbox로 나눠서 출력을 달리 하려합니다. 조언 부탁드립니다...ㅠ

 


const Filterlist = () => {
 //중략..
  return (
    <div>
      {fiters.map((filter) => (
 
        //selectbox일때
        filter.type == 'selectbox' &&
        <div className="filter_selector" key={filter.queryName}>
        <select onChange={(e) => setFilteredData({ [filter.queryName]: e.target.value })} placeholder={filter.placeholder} >
          {filter?.items?.map((item) => (
            <option value={item.value} key={item.value}>
              {item.name}
            </option>
          ))}
        </select>
      </div>
       
        //checkbox 일때
        filter.type == 'checkbox' &&
       <div>여기는 체크박스 들어감</div>
 
 
      ))}
     
    </div>
  )
}

 
export default Filterlist
 

이 질문에 댓글 쓰기 :

답변 1


{filters.map((filter) => {
        return (
        <div>
        {filter.type == 'selectbox' &&
          <>
            <div className="filter_selector" key={filter.queryName}>
              <select onChange={(e) => setFilteredData({ [filter.queryName]: e.target.value })} placeholder={filter.placeholder} >
                {filter?.items?.map((item) => (
                  <option value={item.value} key={item.value}>
                    {item.name}
                  </option>
                ))}
              </select>
            </div>
            {filter.type == 'checkbox' &&
              <div>여기는 체크박스 들어감</div>
            }
          </>
        }
        </div>
        )
      })}
답변을 작성하시기 전에 로그인 해주세요.
전체 14
QA 내용 검색
filter #map ×

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT