- {/*
- 위에서 import 한 Counter 컴포넌트를 선언 props를 이용해서
- handleIncrease와 handleDecrease함수와 number의 값을 전달 한다.
- props는 상위컴포넌트에서 하위컴포넌트로 데이터와 함수를 전달할때 사용 하는 속성으로
- props로 데이터를 받은 컴포넌트에서는 데이터 변경이 불가 하다.
- */}
+ Welcome to React
+
+
+ To get started, edit src/App.js and save to reload.
+
);
}
}
-
//외부에서 import로 불러오기 위해서는 export를 해줘야 한다.
//default는 하나의 모듈 혹은 class만 export할때 써준다.
//https://enyobook.wordpress.com/2016/08/17/export-default%EC%97%90-%EB%8C%80%ED%95%B4/
diff --git a/1week/class/src/Clock.js b/1week/class/src/Clock.js
new file mode 100644
index 000000000..03ab465a0
--- /dev/null
+++ b/1week/class/src/Clock.js
@@ -0,0 +1,41 @@
+import React, { Component } from "react";
+
+class Clock extends Component {
+ state = {
+ date: new Date()
+ };
+
+ //CB 호출 순서를 파악하자.
+ handleIncrease() {
+ this.intervalId = setInterval(() => {
+ this.setState({ date: new Date() });
+ }, 1000);
+ }
+ handleDecrease() {
+ this.intervalId = clearInterval(() => {
+ this.setState({ date: Date() });
+ });
+ }
+
+ componentDidUpdate() {
+ console.log("update");
+ }
+
+ render() {
+ console.log("render");
+ return (
+