[React] 노마드 코더 인강 -Hooks

Yuzu·2023년 3월 26일
0
post-custom-banner
const name= useInput("Mr."); //custom Hook

return~~
<input placeholder="name" value={name.value} onChange={name.onChange} />

===
<input placeholder="name" {...name} />

{...name} 로 태그 안 속성들을 퉁칠 수 있다는 것... 배웠다

  • Array.isArray() 메서드
    해당 인자가 array 형태 인지 확인해주는 메서드
  • function 에서 return; 하고 끝내는 경우 해당 함수를 종료하는 의미를 가지고 있음
const useInput = (initialValue) => {
  const [value, setValue] = useState(initialValue);

  const onChange = () => {
    console.log(onChange);
  };

  return [value,onChange]; // 1

1// 각각 state 와 함수를 할당해서 할당된 값을 이용해서 UI를 구현한다.


const useTabs = (initial)=>{
const [currentIndex, setCurrentIndex] = useState(initial);

return { currentItem= allTabs(currentIndex), 
changeItem= setCurrentIndex
} //1
}

1// return을 객체로 나타낼시 UI 쪽 코드에서 구조분해할당하여 useTabs에서 정의된 값들을 사용할 수 있음

const { currentItem, changeItem } =useTabs(0, content) 
profile
냐하
post-custom-banner

0개의 댓글