이 기능을 console.log()하는 방법은 무엇입니까?

Question

React-Native 용 JSX를 생성하고 싶습니다만, console.log()을 사용하여 각 키/값을 검사하고 싶습니다.

난 후 나는 무엇을 :

{Object.keys(this.state.types).map((obj) => (
      console.log(obj); <-- This guy 
      <Item label={obj[TYPE]} value={obj[ID]} /> 
     ))} 

그러나 오류가

이 어떻게 여전히지도 안에 내 값을 디버깅 할 수 있습니다 "예기치 않은 토큰"을 발생합니다?

Answer 1

당신은 쉼표 연산자 사용할 수 있습니다 문을 평가하고이를 폐기

{Object.keys(this.state.types).map((obj) => (
     console.log(obj), <-- This guy 
     <Item label={obj[TYPE]} value={obj[ID]} /> 
    ))} 

를, 또는 당신을 ||를 사용할 수 있습니다. 반환 후 false을 반환 console.log을 평가합니다 운영자가 요소 반작용 : 모두가 매우 해키입니다, 그러나

{Object.keys(this.state.types).map((obj) => console.log(obj) || (

     <Item label={obj[TYPE]} value={obj[ID]} /> 
    ))} 

을, 당신이 여러 줄 화살표로 화살표 기능을 켜 그냥 return를 사용하는 것이 좋습니다 :

{Object.keys(this.state.types).map((obj) => { 
     console.log(obj); 
     return <Item label={obj[TYPE]} value={obj[ID]} /> 
    })} 

추가 정보 - 배열에서 반환 된 객체에 key 속성을 설정하는 것을 잊지 마십시오. 성능 저하 및 경고 (현재이 작업을 수행하지 않음)가 표시됩니다.

Answer 2

둥근 괄호 (=> ()는 개체에 JSX 개체가 반환된다는 것을 함수에 알려줍니다. 함수 본문을 console.log()으로 실행 한 다음 <Item> 요소를 반환합니다.

곱슬들에 괄호를 변환하고, return 문 추가

{Object.keys(this.state.types).map((obj) => { 
    console.log(obj); <-- This guy 
    return (
    <Item label={obj[TYPE]} value={obj[ID]} /> 
); 
})}