react hook

sanghun Lee·2020년 9월 4일
0

const[state <- 값, setState-< 함수 ] = useState(초기값);

this.state = {count: 0}

const[count, setCount] = useState(0);// 객체 비구조화할당처럼 배열 비구조화할당이라 생각하면됨.

onclick = (()=>setCount(count+1))

setPosition({...position, width:10})

userEffect(()=>{}, [count])
[count]는 의존성배열임 안에 하나만이라도 변경되면 업데이트됨
userEffect(()=>{}, []) => 최초렌더 한번만 실행
userEffect(()=>{})=>매 렌더마다 실행

count라는 스테이트의 업데이트가 될떄마다 실행됨

만약 countrk djqtdmaus

"results": [
  {
    "gender": "female",
    "name": {
      "title": "miss",
      "first": "mia",
      "last": "sutton"
    }
  }
]

};

// declare a const variable named firstItem that holds the first element of the array
const { results: [firstItem] } = data;
// You could event destructure the content of this first array item like this
const { results: [{ gender, name }] } = data;
// or go deeper like this
const { results: [{ name: { title, first, last } }] } = data;

console.log(firstItem);

console.log(gender);
console.log(name);
console.log(title, first, last);

map에 undefined가 뜨면 라이프사이클을 생각 한 후

            {gridContents &&
            gridContents.map((el) => (
              <CardContents
                width={el.width}
                src={el.src}
                issue={el.issue}
                title={el.title}
                explanation={el.explanation}
              />
            ))}
profile
알고리즘 풀이를 담은 블로그입니다.

0개의 댓글