質問編集履歴

2

詳しく書きました。

2021/02/23 04:54

投稿

mentanpinsan
mentanpinsan

スコア23

test CHANGED
File without changes
test CHANGED
@@ -38,7 +38,7 @@
38
38
 
39
39
  useEffect(() => {
40
40
 
41
- setState([{id: 2, name: "tim"}, ...arr])
41
+ setState([{id: 0, name: "tam"}, ...arr])
42
42
 
43
43
  },[])
44
44
 
@@ -86,41 +86,49 @@
86
86
 
87
87
 
88
88
 
89
+ これはuseEffectがレンダリング後に実行されるためにレンダリング時に
90
+
89
91
  ```
90
92
 
91
- <p>{state[1].name}</p>
93
+ state[1].name
94
+
95
+ ```
96
+
97
+ に値が入っていないからだと思うのですが
92
98
 
93
99
 
94
100
 
95
101
  ```
96
102
 
97
- 上記の箇所をコメントアウトするとエラーはでません。
103
+ <div>
98
104
 
105
+ <p>{state[0].name}</p>
99
106
 
107
+ <p>{state[1].name}</p>
100
108
 
101
- はじめに
109
+ </div>
102
110
 
103
111
  ```
104
112
 
105
- console.log(state);
106
-
107
- ```
113
+ の部分を
108
-
109
- がレンダリング前に実行されて
110
114
 
111
115
 
112
116
 
113
117
  ```
114
118
 
115
- 0: {id: 0, name: "init"}
119
+ <ul>
116
120
 
117
- length: 1
121
+ {state.map(el => (
118
122
 
123
+ <li>{el.name}</li>
124
+
125
+ ))}
126
+
119
- __proto__: Array(0)
127
+ </ul>
120
128
 
121
129
  ```
122
130
 
123
- が返ってきて初回レンダリング後にsetStateが実行されて、state更新があったの再描画されるまえにも一度
131
+ に変更すると問題なくレンダリングされは何故しょか?
124
132
 
125
133
 
126
134
 

1

詳しく書きました。

2021/02/23 04:54

投稿

mentanpinsan
mentanpinsan

スコア23

test CHANGED
File without changes
test CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
 
4
4
 
5
- 初回レンダリング時stateレンダリングしたい。
5
+ 初回レンダリング時のuseEffectの作用理解したい。
6
6
 
7
7
 
8
8