質問編集履歴
2
コードにあるコメントの説明を追加
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -10,6 +10,9 @@
|
|
|
10
10
|
|
|
11
11
|
#実際のコード
|
|
12
12
|
|
|
13
|
+
練習で作っているので、一つのファイルにまとめて書いています。
|
|
14
|
+
見やすいようにコメントをつけました。
|
|
15
|
+
|
|
13
16
|
```js
|
|
14
17
|
import React from "react";
|
|
15
18
|
import ReactDOM from "react-dom";
|
1
コード内にコメントを追加
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -16,8 +16,8 @@
|
|
|
16
16
|
|
|
17
17
|
import "./styles.css";
|
|
18
18
|
|
|
19
|
+
// form - ここにstateをもたせるべきか
|
|
19
20
|
class TodoInput extends React.Component {
|
|
20
|
-
// ここにstateをもたせて値を保存するべきか
|
|
21
21
|
render() {
|
|
22
22
|
return (
|
|
23
23
|
<>
|
|
@@ -31,6 +31,7 @@
|
|
|
31
31
|
}
|
|
32
32
|
}
|
|
33
33
|
|
|
34
|
+
// todoの一つの要素を表すコンポーネント
|
|
34
35
|
const TodoItem = props => {
|
|
35
36
|
return (
|
|
36
37
|
<>
|
|
@@ -40,6 +41,7 @@
|
|
|
40
41
|
);
|
|
41
42
|
};
|
|
42
43
|
|
|
44
|
+
// データを受けて一覧表示させている
|
|
43
45
|
class TodoList extends React.Component {
|
|
44
46
|
render() {
|
|
45
47
|
const list = this.props.tasks.map(task => {
|
|
@@ -53,6 +55,8 @@
|
|
|
53
55
|
}
|
|
54
56
|
}
|
|
55
57
|
|
|
58
|
+
// 親コンポーネント、stateをここに固めたい。
|
|
59
|
+
// formで入力した情報をクリックしたらsetStateしたい。
|
|
56
60
|
class App extends React.Component {
|
|
57
61
|
constructor() {
|
|
58
62
|
super();
|