回答編集履歴
1
更にスリム化
test
CHANGED
|
@@ -6,27 +6,31 @@
|
|
|
6
6
|
|
|
7
7
|
//todoリストの制御用コンポーネント。flgは判定用
|
|
8
8
|
|
|
9
|
-
const todoList = (
|
|
9
|
+
const todoList = (flg) =>{
|
|
10
10
|
|
|
11
|
-
|
|
11
|
+
return todos.map((val, idx) =>{
|
|
12
12
|
|
|
13
|
-
|
|
13
|
+
if(val.completed === flg){
|
|
14
14
|
|
|
15
|
-
|
|
15
|
+
return(
|
|
16
16
|
|
|
17
|
-
|
|
17
|
+
<li key={idx}>
|
|
18
18
|
|
|
19
|
-
|
|
19
|
+
{val.title} <span onClick={() => handleCompletedTask(idx)}>X</span>
|
|
20
20
|
|
|
21
|
+
</li>
|
|
22
|
+
|
|
23
|
+
)
|
|
24
|
+
|
|
21
|
-
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
})
|
|
22
28
|
|
|
23
29
|
}
|
|
24
30
|
|
|
25
31
|
|
|
26
32
|
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
return (
|
|
33
|
+
return (
|
|
30
34
|
|
|
31
35
|
<div>
|
|
32
36
|
|
|
@@ -54,15 +58,7 @@
|
|
|
54
58
|
|
|
55
59
|
<ul>
|
|
56
60
|
|
|
57
|
-
{
|
|
58
|
-
|
|
59
|
-
todos.map((val, index) =>{
|
|
60
|
-
|
|
61
|
-
|
|
61
|
+
{todoList(false)}
|
|
62
|
-
|
|
63
|
-
})
|
|
64
|
-
|
|
65
|
-
}
|
|
66
62
|
|
|
67
63
|
</ul>
|
|
68
64
|
|
|
@@ -70,15 +66,7 @@
|
|
|
70
66
|
|
|
71
67
|
<ul>
|
|
72
68
|
|
|
73
|
-
{
|
|
74
|
-
|
|
75
|
-
todos.map((val, index) =>{
|
|
76
|
-
|
|
77
|
-
|
|
69
|
+
{todoList(true)}
|
|
78
|
-
|
|
79
|
-
})
|
|
80
|
-
|
|
81
|
-
}
|
|
82
70
|
|
|
83
71
|
</ul>
|
|
84
72
|
|
|
@@ -86,13 +74,15 @@
|
|
|
86
74
|
|
|
87
75
|
);
|
|
88
76
|
|
|
77
|
+
|
|
78
|
+
|
|
89
79
|
}
|
|
90
80
|
|
|
91
81
|
```
|
|
92
82
|
|
|
93
83
|
|
|
94
84
|
|
|
95
|
-
あとはxボタンを押したときに、フラグを変えて、それを分割代入で同期をとれば、期待通りの動作ができるのではないかと思います。
|
|
85
|
+
あとはxボタンを押したときに、変数todos内のcompleteのフラグ値を変えて、それを分割代入で同期をとれば、期待通りの動作ができるのではないかと思います。
|
|
96
86
|
|
|
97
87
|
|
|
98
88
|
|