수업소개
React는 컴포넌트를 외부에서 조작할 때는 props를 내부적으로 상태를 관리할 때는 state를 사용합니다. 여기서는 state에 대해서 소개하고, state를 다루는 방법을 소개합니다.
강의 1
강의 2
state의 사용
강의 3
복수의 앨리먼트를 생성할 때는 key라는 특수한 props를 사용해야 합니다. 여기서는 key의 사용법을 소개합니다.
댓글
-
완료했읍니다. 감사합니다. -
강의 3번 어렵네요 ㅎㅎ. 난이도 급 상승한 느낌입니다.
그래도 커밋 링크 주셔서 그거 보고 공부할 있어서 정말 좋네요. 이번 강의도 꿀잼이었습니다! -
2020.03.05
-
감사합니다
-
15.3 강의 실습하고 있는 도중, <li key={data[i].id}> 이와 같이 key 값을 주었는데도, 오류가 발생합니다. CSS값이 로컬호스트페이지에 나와야하는데, HTML 값이 자꾸 나오네요.. TOC 소스코드는 해당 강의와 동일합니다.
Warning: Encountered two children with the same key, `1`. Keys should be unique so that components maintain their identity across updates. Non-unique keys may cause children to be duplicated and/or omitted — the behavior is unsupported and could change in a future version.
무엇이 문제일까요..
+ 해결했습니다. App.js에서 id값을 잘 못 주었네요.. -
2019-10-15 완료
-
다른 페이지로 이동하게 하려면 정확한 주소를 입력해야 겠지요.
그렇지만 여기서는 그냥 아무거나 적었다고 생각하시면 됩니다.
e.preventDefault로 링크를 막아놓았기 때문입니다. -
컴포넌트에 주입할 때 sub와 title을 사용한다면...
sub와 title은 props가 됩니다.
컴포넌트에서 사용하지 않으면 props가 아닙니다.
[ props와 state의 이해 ]
함수와 비슷하다고 생각하면 이해하기 쉽습니다.
자세한 내용 : https://docs.google.com......ing -
javascript, jquery 만 보다.... react 를 보니..., 신세계네요....
수업내용 이해하기 쉽고 넘 좋네요...
감사합니다. -
감사합니다.
-
this.state = { subject: { title: 'web' } }
에서 subject와 title을 모두 props라고 부르나요?
다른 명칭이 있나요? -
나중에 라우팅하기 편하라고 덧붙인 문자열인 것 같습니다.
-
a 태그의 값을 임으로 '"/contect" + {data[i].id}로 바꾸시면 될 것 같습니다!
-
네. <a href={data[i].id+".html"}> 은 이해가 갑니다! 답변 감사합니다:)
-
while (i < data.length) {
lists.push(<li key={data[i].id}><a href={data[i].id+".html"}>{data[i].title}</a></li>);
i = i + 1;
}
이렇게 하면 전에 있던 코드처럼 1.html로 하이퍼링크가 됩니다. -
흑흑.. 리액트 어렵네요.. TOC의 <li>태그를 반복문으로 만드는 과정에서 <a href="1.html"> 부분을 <a href={"/content/" + data[i].id}> 이렇게 바꾸셨는데요. 여기서 "/content/" 이것은 어디를 참조한 데이터인지 모르겠습니다ㅠㅠ App.js에서 state로 "contents" 값을 설정할때 id, title, desc까지만 코드를 줬는데 a태그의 content는 어디서 나온걸까요?
