質問編集履歴
4
微修正
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -19,16 +19,14 @@
|
|
|
19
19
|
ここまでで確認したことを簡潔にまとめると
|
|
20
20
|
|
|
21
21
|
・ ActionCreatorは問題なく機能している（ActionはDispatchされている）
|
|
22
|
-
・ Reducerは問題なく機能している（Actionを渡せば適切に処理してくれる）
|
|
23
22
|
|
|
24
23
|
|
|
25
24
|
です。テキスト入力のたびにdispatchされるactionは想定ではmiddlewareで止まり、reducerには流れません。
|
|
26
25
|
middlewareではsuccessかfailの別のactionをdispatchするようにしています。
|
|
27
26
|
しかし、実際にはreducerにテキスト入力のたびにdispatchされるactionが流れています。
|
|
28
27
|
（一時的にreducerにテキスト入力のたびにdispatchされるactionのcaseを追加して確かめました）
|
|
29
|
-
そのため、ActionCreatorとReducerは問題なく、Middlewareが問題だと考えています。
|
|
30
28
|
|
|
31
|
-
また、前提の 4,5 を問題ありかもにしたのは `initialState` に適当なオブジェクトを入れても
|
|
29
|
+
また、前提の 4,5 を問題ありかもにしたのはreducerで `initialState` に適当なオブジェクトを入れてもFlatListに反映されなかったためです。
|
|
32
30
|
|
|
33
31
|
大きく分けて
|
|
34
32
|
・ 前提における 2, 3 が問題。つまり redux-saga の扱いに問題がある。
|
3
微修正
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -7,8 +7,8 @@
|
|
|
7
7
|
1. SearchBarにテキストを入力するたびにonChangeTextでactionをdispatchする。（問題ない）
|
|
8
8
|
2. Middlewareで 1 の時にdispatchされるactionを監視する（問題あり）
|
|
9
9
|
3. APIを叩いて取得したリポジトリを包んでreducerにsuccessかfailのactionをdispatch（問題あり）
|
|
10
|
-
4. reducerで新たなstateを作成してstoreを更新（問題
|
|
10
|
+
4. reducerで新たなstateを作成してstoreを更新（問題ありかも）
|
|
11
|
-
|
|
11
|
+
5. FlatListでstateの状態を監視してリポジトリの状態が変わったら、UIに反映させる（問題ありかも）
|
|
12
12
|
|
|
13
13
|
|
|
14
14
|
## ゴール
|
|
@@ -28,9 +28,16 @@
|
|
|
28
28
|
（一時的にreducerにテキスト入力のたびにdispatchされるactionのcaseを追加して確かめました）
|
|
29
29
|
そのため、ActionCreatorとReducerは問題なく、Middlewareが問題だと考えています。
|
|
30
30
|
|
|
31
|
-
|
|
31
|
+
また、前提の 4,5 を問題ありかもにしたのは `initialState` に適当なオブジェクトを入れてもUIに反映されなかったた目です。
|
|
32
|
-
アドバイス頂ければ幸いです。
|
|
33
32
|
|
|
33
|
+
大きく分けて
|
|
34
|
+
・ 前提における 2, 3 が問題。つまり redux-saga の扱いに問題がある。
|
|
35
|
+
・ 前提における 4, 5 が問題。つまり ReducerとStore、Componentの連携に問題がある。
|
|
36
|
+
のどちらかだと考えています。
|
|
37
|
+
|
|
38
|
+
|
|
39
|
+
解決の糸口になるようなアドバイスを頂ければ幸いです。
|
|
40
|
+
|
|
34
41
|
## コード
|
|
35
42
|
- Component（問題となるFlatListを使用しているComponent）
|
|
36
43
|
このアプリではSearchBarの onChangeText と連動してリアルタイムでAPIを叩いています。
|
2
不要な文を削除
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
## 前提
|
|
2
2
|
React Native + ReduxでGitHubのリポジトリを検索できるアプリを作成しています。
|
|
3
3
|
非同期処理の部分でredux-sagaを使用しています。
|
|
4
|
-
ActionCreatorでActionをdispatchするとmiddlewareが機能していないのか、そのままreducerへとActionが飛んでしまいます。（詳細は後述します）
|
|
5
4
|
|
|
6
5
|
想定している流れとしては以下の通りです。
|
|
7
6
|
|
1
詳細説明を追加しました
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -1,25 +1,37 @@
|
|
|
1
1
|
## 前提
|
|
2
2
|
React Native + ReduxでGitHubのリポジトリを検索できるアプリを作成しています。
|
|
3
3
|
非同期処理の部分でredux-sagaを使用しています。
|
|
4
|
+
ActionCreatorでActionをdispatchするとmiddlewareが機能していないのか、そのままreducerへとActionが飛んでしまいます。（詳細は後述します）
|
|
5
|
+
|
|
6
|
+
想定している流れとしては以下の通りです。
|
|
7
|
+
|
|
8
|
+
1. SearchBarにテキストを入力するたびにonChangeTextでactionをdispatchする。（問題ない）
|
|
9
|
+
2. Middlewareで 1 の時にdispatchされるactionを監視する（問題あり）
|
|
10
|
+
3. APIを叩いて取得したリポジトリを包んでreducerにsuccessかfailのactionをdispatch（問題あり）
|
|
4
|
-
|
|
11
|
+
4. reducerで新たなstateを作成してstoreを更新（問題なし）
|
|
12
|
+
4. FlatListでstateの状態を監視してリポジトリの状態が変わったら、UIに反映させる（問題なし）
|
|
13
|
+
|
|
14
|
+
|
|
5
|
-
|
|
15
|
+
## ゴール
|
|
16
|
+
SearchBarで onChnageTextのたびにAPIを叩いてリポジトリを取得し、FlatListに表示する。
|
|
6
17
|
※ Javascirpt初心者のため記法など雑な部分が散見されますがご容赦頂ければ幸いです。
|
|
7
18
|
|
|
8
19
|
## 現状の把握と問題点の仮説
|
|
9
20
|
ここまでで確認したことを簡潔にまとめると
|
|
10
21
|
|
|
11
|
-
・ ActionCreatorは問題なく機能している
|
|
22
|
+
・ ActionCreatorは問題なく機能している（ActionはDispatchされている）
|
|
12
|
-
・ Reducerは問題なく機能している
|
|
23
|
+
・ Reducerは問題なく機能している（Actionを渡せば適切に処理してくれる）
|
|
13
24
|
|
|
14
25
|
|
|
15
|
-
です。
|
|
26
|
+
です。テキスト入力のたびにdispatchされるactionは想定ではmiddlewareで止まり、reducerには流れません。
|
|
27
|
+
middlewareではsuccessかfailの別のactionをdispatchするようにしています。
|
|
28
|
+
しかし、実際にはreducerにテキスト入力のたびにdispatchされるactionが流れています。
|
|
29
|
+
（一時的にreducerにテキスト入力のたびにdispatchされるactionのcaseを追加して確かめました）
|
|
30
|
+
そのため、ActionCreatorとReducerは問題なく、Middlewareが問題だと考えています。
|
|
16
31
|
|
|
17
|
-
・ APIで取得したリポジトリを表示するFlatListとStoreのconnectが上手くいっていない
|
|
18
|
-
|
|
32
|
+
しかし、なぜ機能していないのかが分からないです。
|
|
33
|
+
アドバイス頂ければ幸いです。
|
|
19
34
|
|
|
20
|
-
です。
|
|
21
|
-
タイトルの通り後者が原因だと踏んでいます。しかし、なぜ機能していないのかが分からないです。
|
|
22
|
-
|
|
23
35
|
## コード
|
|
24
36
|
- Component（問題となるFlatListを使用しているComponent）
|
|
25
37
|
このアプリではSearchBarの onChangeText と連動してリアルタイムでAPIを叩いています。
|