useState (4) 썸네일형 리스트형 [React 기초 문법] #3 state와 props props와 state의 의미 state는 컴포넌트 내부에서 바뀔 수 있는 값을 의미한다. props는 컴포넌트가 사용되는 과정에서 부모 컴포넌트가 설정하는 값으로 컴포넌트 내에서 읽을 수만 있다. 따라서 props를 바꾸려면 부모 컴포넌트에서 바꾸어야만 한다 . 공식문서에 의하면 함수 컴포넌트나 클래스 컴포넌트 모두 컴포넌트의 자체 props를 수정해서는 안된다. 모든 React 컴포넌트는 자신의 props를 다룰 때 반드시 순수함수 (입력값을 바꾸려 하지 않고 항상 동일한 입력값에 대해 동일한 결과를 반환하는 함수)처럼 동작해야한다. 라는 말이 있다. 사용자의 액션, 네트워크의 응답 및 다른 요소에 대한 응답으로 시간에 따라 props가 컴포넌트 내에서 바뀌어야만 하는 상황이 있는데 이때 사용하는 것.. 2021년 5월 3일 코드스테이츠 DAY-29 React(unshift가 아닌 useState를 통한 정보의 최신화 그리고 select tag를 통한 filter된 정보만 보여주기) 2021년 5월 2일 React State & Props 예습(이벤트 핸들링을 통한 정보 전달 + ubuntu npm run test / npm run start ( 내일부터 들어가는 React State & Props를 대비하여 미리 sprint를 진행해보았다. 그 중 핵심이라고 생각하는 이벤트 핸들링 부분을 적겠다. 일단 언급할 부분부분의 코드는 아래와 같다. const Tweets = ( bedeveloper.tistory.com 위 어제 일자로 된 글을 보면 unshift로 새롭게 만든 tweet을 넣은것이 실제로 tweet창에는 정상적으로 추가 되었으나, testcase는 통과하지 못했음을 언급했었다. 해결방법은 결국에 useState의 set함수로 기존 dummyTweet에 새로운 tweet을.. 2021년 5월 2일 React State & Props 예습(이벤트 핸들링을 통한 정보 전달 + ubuntu npm run test / npm run start (React) 오류 해결) 내일부터 들어가는 React State & Props를 대비하여 미리 sprint를 진행해보았다. 그 중 핵심이라고 생각하는 이벤트 핸들링 부분을 적겠다. 일단 언급할 부분부분의 코드는 아래와 같다. const Tweets = () => { const [name, setName] = useState(''); const [sentence, setSentence] = useState(''); const handleButtonClick = () => { const tweet = {}; tweet.id = data.length + 1; tweet.username = name; tweet.content = sentence; }; const handleChangeUser = (event) => { setName(e.. 2021년 4월 29일 코드스테이츠 DAY-25 (Movie app 제작 ERROR 해결로 얻은(?) 지식과 Twittler with "React"에서 이 지식을 활용) 2021년 4월 28일 코드스테이츠 DAY-24 (React 예습 및 Movie app 제작 중 ERROR... feat.니꼬) React 내일부터 React를 들어가기에 니꼬센세의 Movie app 제작 강의를 듣기 시작했고 중요한 지식을 접하게 되었다. 아래는 두서없지만 가장 중요하다고 생각한 부분을 받아 적어놓은 것이다. Componen bedeveloper.tistory.com Movie app 제작 ERROR 해결로 얻은 지식 : React 기초 결론은 무엇이었냐하면 Movie Component의 매개변수에 { }중괄호가 빠져있었던 것 분명히 니꼬센세의 강의를 들으며 받아적었고 심지어 어제 게시글에 이것에 대한 개념을 받아적었음에도 이 부분을 발견하지 못하여 한참을 헤매었다. 다시한번 상기해 보.. 이전 1 다음
