전체 글 (47) 썸네일형 리스트형 bind 함수와 setState 함수 이해하기 오늘 강의는 bind 함수와 setState 함수 이해하기에 대해 다뤘다. 1. bind() bind, 묶어준다 라는 뜻. render()라는 함수가 호출될 때, this는 그 컴포넌트 자신을 가리킨다. 위는 콘솔에서 테스트를 한 것이다. 우선, obj라는 변수를 만들어서 특정 값을 준다. 그리고 나서 bindTest()라는 함수를 만들게 되는데, 이 함수에서 this.name을 출력하게 하고 싶다. 그러나 여기서 this라는 객체가 무엇인지는 정의가 전혀 되어있지 않다. 이렇게 했을 때 undefined가 뜨는 것은 당연하다. 이 this가 특정 개체를 가리키게 하고, 이 obj값의 name을 출력하게 하고 싶다면, this가 무엇인지를 설정하게 해줘야 한다. 그래서 위와 같이 bindTest의 함수에.. 이벤트 state props와 render 함수 역동적으로 만들어주는 기술인 이벤트에 대해서 공부를 하였다. 예를 들어 클릭한 것에 대한 화면을 표시할 곳이 매번 달라지고 화면 출력이 달라지는 경우. mode를 설정해주기 그 mode에 따른 살태와 값을 설정해주기 render() 함수가 다시 호출됨으로써 다시 화면을 출력하게 되는데, 이 때 일어나는 이렇게 이벤트를 만드는 것이 목표임. porps와 state가 바뀌면 다시 함수가 호출 되게끔 만들어야 한다. 1. mode를 설정하고, 그 mode가 되었을 때 설정되는 props 값이라던지 state 값을 따로 설정해준다. 2. 그리고 if 문을 통해서 mode가 원하는 조건에 충족되었을 때, 어떤 값들을 바꾸게 될 것인지 설정해준다. 3. 이 값이(props나 state 값) 바뀌면 render() .. 6.5] React Props (default props) 1. Default Props props의 기본값을 주고 싶을 때나, 경우에 따라 비워놔야 할 때가 있다. 그러한 경우에 props의 기본값을 설정해 줄 수 있는데, 그것이 바로 defaultProps이다. 저번 App.js파일의 마지막 컴포넌트인 밑에 새로운 라는 컴포넌트를 만들어 보았다. 에서는 하나의 props를 가지는데, props의 이름은 dp(defaultProps의 줄임말....인데.....동적 프로그래밍이 생각난다...ㅎㅎ)으로 정하였다. defaultProps는 render() 함수 전에 적어준다. 그리고 App컴포넌트에 defaultProps값이 잘 출력되는지 확인하기 위해 (App.js에서) 17line에는 props값을 지정해주었고, 18line에는 그냥 컴포넌트 명만 적어주었다. .. 이전 1 ··· 4 5 6 7 8 9 10 ··· 16 다음
