코딩/위코드 코딩학습

[위코드] TIL(Today I am learned) -12

카슈밀 2020. 7. 19. 22:43
반응형

이번 내용은 React의 내용입니다.

12번의 내용이 작성중에 날라갔기에... 어쩔 수 없이 13, 14의 내용이 먼저 올라갔음을 사과하는 바입니다. ㅠ

constructor () { 
  console.log("");
  super ();
}

constructor는 최우선으로 불려짐.
	this.state = {
	a : 10,
	b : 20 
}

setState state값을 수정.
이때 render를 부르지 않으면 화면에 출력되지 않음.
키값은 수정되었으나 return에서 렌더를 불러와줘야함.

 

<button onClick={() => }>

애로우 펑션을 사용할 것. =>
 

애로우 펑션은 자바스크립트에서 쓰는  ECMA6의 용어라서 나는 가급적 쓰질 않아 처음에는 '저게 뭐지?'하고

이해를 하지 못했다.

애초에 잘 쓰지 않는 부분이라 헷깔려했는데, 나중에 추가로 공부해서 다시 인지하였다.

그냥 function을 저렇게 표기하는 방식이다.

펑션뒤에 소괄호는 ()인자가 아님. 그냥 호출하라는 뜻
function name(내용이 필요.)
function name() 그냥 끝.


<button onClick={function name() => } />

this란? 해당 컴포넌트의 위치를 의미함.

class Monsters extends Componentd {} 에서 Monstes를 의미함.

this.setState를 해석해보면 Mosters컴포넌트에서 setState를 이용하여 렌더링해라.라는 뜻이다.

this를 사용. 이 클래스를 사용해라. 

this를 어떻게 쓰나? 메소드를 상위 메소드를 다시 사용해라. 
this.setState({ b: 70}); 
setState를 사용하는 이유는 변화값이 있으니 컴퓨터한테 다시 렌더할 수 있게 리턴하라고 하는 것.
setState는 this를 꼭 쓸것.


setState의 역할은 기존에 설정한 값인 state를 바뀌었는데, 컴퓨터가 이를 모르고 있으나
this.해당 함수이름을 호출하면 다시 세팅하라는 것으로 능동적으로 변화점이 있으니 이를 표시하라는 뜻이다.
고로 setState로 해당 state값이 바뀌면, 이를 렌더해준다.

해당값을 this.state안에는 객체. 소괄호 안에 중괄호 사용! ({})
{}은 리터럴 자바스크립트.


state 역할
컨스트럭터는 무조건 호출

super는 무엇인가??????
 - React에서 Constructor에 있는 super는 무슨 의미로 사용되는 것인가? 

   답은 단순하다. 해당 값을 초기화하기 위해서 사용된다.

   자세한 내용으로는 props를 초기화하여 해당값을 받아들이는 역할을 한다.
나의 Github pr의 문제는 무엇일까??????
  - 문제는 이전에 pull request를 했는데, 과제를 실수로 reomte repo의 내용을 merge하는 바람에 다시 pr을 날렸으나 해당 내용이 동일하여 pr을 받지 못하였다. 처음에는 그것을 몰라서 pr을 중단하고, 다른 것을 하는 바람에 해당 내용이 변하였고, 그런 덕분에 해당 내용에 변화가 있어 pr을 요청해보니 작동하여 해결하였다.

728x90