回答編集履歴
6
a
test
CHANGED
@@ -152,7 +152,7 @@
|
|
152
152
|
|
153
153
|
|
154
154
|
|
155
|
-
とりあえず、`componentWillMount`内で`this.props.messagesFetch(room)`している訳ですから、このライフサイクルメソッド内で`console.log('message3, message)`のように`message`を参照しようとしても、まだ、reduxのstoreにmessage入っていないので参照出来ません。
|
155
|
+
とりあえず、`componentWillMount`内で`this.props.messagesFetch(room)`している訳ですから、このライフサイクルメソッド内で`console.log('message3, message)`のように`message`を参照しようとしても、まだ、reduxのstoreにmessage入っていないので参照出来ません。このコンポーネント内で参照できるようになるのは、`componentWillReceiveProps`以降のライフサイクルメソッドです。
|
156
156
|
|
157
157
|
|
158
158
|
|
5
a
test
CHANGED
@@ -117,3 +117,63 @@
|
|
117
117
|
|
118
118
|
|
119
119
|
必要であれば、`{ type: 'messages_fetch_success', payload: message }`に対応している`reducer`のコードも追記してください。不要そうであれば、そちらのコードの追記も不要です。
|
120
|
+
|
121
|
+
|
122
|
+
|
123
|
+
# 追記3
|
124
|
+
|
125
|
+
|
126
|
+
|
127
|
+
```
|
128
|
+
|
129
|
+
componentWillMount() {
|
130
|
+
|
131
|
+
const room = this.props.navigation.state.params.room;
|
132
|
+
|
133
|
+
this.props.messagesFetch(room);
|
134
|
+
|
135
|
+
|
136
|
+
|
137
|
+
console.log('message3, message);
|
138
|
+
|
139
|
+
this.setState((previousState) => {
|
140
|
+
|
141
|
+
return {
|
142
|
+
|
143
|
+
messages: GiftedChat.append(previousState.messages, message),
|
144
|
+
|
145
|
+
};
|
146
|
+
|
147
|
+
});
|
148
|
+
|
149
|
+
}
|
150
|
+
|
151
|
+
```
|
152
|
+
|
153
|
+
|
154
|
+
|
155
|
+
とりあえず、`componentWillMount`内で`this.props.messagesFetch(room)`している訳ですから、このライフサイクルメソッド内で`console.log('message3, message)`のように`message`を参照しようとしても、まだ、reduxのstoreにmessage入っていないので参照出来ません。
|
156
|
+
|
157
|
+
|
158
|
+
|
159
|
+
次に、そもそものところで、追記2にも書きましたが、`mapStateToProps`内で`message`を取ってないですよね。
|
160
|
+
|
161
|
+
|
162
|
+
|
163
|
+
```
|
164
|
+
|
165
|
+
const mapStateToProps = (state) => {
|
166
|
+
|
167
|
+
const { text, user, createdAt, _id } = state.messageForm;
|
168
|
+
|
169
|
+
return { text, user, createdAt, _id };
|
170
|
+
|
171
|
+
};
|
172
|
+
|
173
|
+
```
|
174
|
+
|
175
|
+
というか話は少し本題からずれますが、ここで参照している`text`やら `user`やらは、`Message`コンポーネント内で一切使っていなくないですか?
|
176
|
+
|
177
|
+
|
178
|
+
|
179
|
+
前提として、`redux`をどれくらい理解されてますでしょうか?
|
4
a
test
CHANGED
@@ -48,7 +48,7 @@
|
|
48
48
|
|
49
49
|
|
50
50
|
|
51
|
-
# 追記
|
51
|
+
# 追記1
|
52
52
|
|
53
53
|
```
|
54
54
|
|
@@ -63,3 +63,57 @@
|
|
63
63
|
いや、`console.log`の前に`return`しているので、`message1`は間違いなくログで取れないですよね?
|
64
64
|
|
65
65
|
今一度、状況を整理して質問内容を見直した方が良さそうですよ。
|
66
|
+
|
67
|
+
|
68
|
+
|
69
|
+
# 追記2
|
70
|
+
|
71
|
+
|
72
|
+
|
73
|
+
追記の内容を確認いたしました。
|
74
|
+
|
75
|
+
|
76
|
+
|
77
|
+
`message3はエラーすら出ません`と当初ありましたが、編集後のコードのどこで`message`を参照したいのですか?
|
78
|
+
|
79
|
+
|
80
|
+
|
81
|
+
質問内容をわかりやすくするために、引き続き、`console.log(message3)`をコード内に入れてください。
|
82
|
+
|
83
|
+
|
84
|
+
|
85
|
+
```
|
86
|
+
|
87
|
+
.then(message => {
|
88
|
+
|
89
|
+
dispatch({ type: 'messages_fetch_success', payload: message });
|
90
|
+
|
91
|
+
console.log('message2', message);
|
92
|
+
|
93
|
+
});
|
94
|
+
|
95
|
+
```
|
96
|
+
|
97
|
+
`messageFetch()`関数の中で`dispatch`していますが、ここで`store`に入れたものは`Message.js`のどこで取得していますか?
|
98
|
+
|
99
|
+
|
100
|
+
|
101
|
+
```
|
102
|
+
|
103
|
+
const mapStateToProps = (state) => {
|
104
|
+
|
105
|
+
const { text, user, createdAt, _id } = state.messageForm;
|
106
|
+
|
107
|
+
return { text, user, createdAt, _id };
|
108
|
+
|
109
|
+
};
|
110
|
+
|
111
|
+
```
|
112
|
+
|
113
|
+
ここで先ほどのところで`dispatch`した`message`、または`messages`を既に取っているのでしょうか?
|
114
|
+
|
115
|
+
取っていないのであれば、`Message`コンポーネントの中で`message`を参照出来ないですよね。
|
116
|
+
|
117
|
+
|
118
|
+
|
119
|
+
必要であれば、`{ type: 'messages_fetch_success', payload: message }`に対応している`reducer`のコードも追記してください。不要そうであれば、そちらのコードの追記も不要です。
|
3
a
test
CHANGED
@@ -44,7 +44,7 @@
|
|
44
44
|
|
45
45
|
|
46
46
|
|
47
|
-
それと、`redux/messageActions.js`を見る限り、利用しているmiddlewareは`redux-thunk`っぽいですが、それで合っていますか?
|
47
|
+
それと、これは単なる確認ですが、`redux/messageActions.js`を見る限り、利用しているmiddlewareは`redux-thunk`っぽいですが、それで合っていますか?
|
48
48
|
|
49
49
|
|
50
50
|
|
2
a
test
CHANGED
@@ -40,7 +40,7 @@
|
|
40
40
|
|
41
41
|
|
42
42
|
|
43
|
-
というのも、`redux/messageActions.js`を見る限り、`messagesFetch`関数が取る引数は`room`オブジェクトのようですが、`componentDidMount`では関数オブジェクトを渡していますよね?
|
43
|
+
というのも、`redux/messageActions.js`を見る限り、`messagesFetch`関数が取る引数は`room`オブジェクトのようですが、`componentDidMount`内での`messagesFetch`関数の呼び出しでは関数オブジェクトを引数に渡していますよね?
|
44
44
|
|
45
45
|
|
46
46
|
|
1
a
test
CHANGED
@@ -45,3 +45,21 @@
|
|
45
45
|
|
46
46
|
|
47
47
|
それと、`redux/messageActions.js`を見る限り、利用しているmiddlewareは`redux-thunk`っぽいですが、それで合っていますか?
|
48
|
+
|
49
|
+
|
50
|
+
|
51
|
+
# 追記
|
52
|
+
|
53
|
+
```
|
54
|
+
|
55
|
+
return message;
|
56
|
+
|
57
|
+
console.log('message1', message);
|
58
|
+
|
59
|
+
```
|
60
|
+
|
61
|
+
|
62
|
+
|
63
|
+
いや、`console.log`の前に`return`しているので、`message1`は間違いなくログで取れないですよね?
|
64
|
+
|
65
|
+
今一度、状況を整理して質問内容を見直した方が良さそうですよ。
|