回答編集履歴
6
a
answer
CHANGED
|
@@ -75,7 +75,7 @@
|
|
|
75
75
|
}
|
|
76
76
|
```
|
|
77
77
|
|
|
78
|
-
とりあえず、`componentWillMount`内で`this.props.messagesFetch(room)`している訳ですから、このライフサイクルメソッド内で`console.log('message3, message)`のように`message`を参照しようとしても、まだ、reduxのstoreにmessage入っていないので参照出来ません。
|
|
78
|
+
とりあえず、`componentWillMount`内で`this.props.messagesFetch(room)`している訳ですから、このライフサイクルメソッド内で`console.log('message3, message)`のように`message`を参照しようとしても、まだ、reduxのstoreにmessage入っていないので参照出来ません。このコンポーネント内で参照できるようになるのは、`componentWillReceiveProps`以降のライフサイクルメソッドです。
|
|
79
79
|
|
|
80
80
|
次に、そもそものところで、追記２にも書きましたが、`mapStateToProps`内で`message`を取ってないですよね。
|
|
81
81
|
|
5
a
answer
CHANGED
|
@@ -57,4 +57,34 @@
|
|
|
57
57
|
ここで先ほどのところで`dispatch`した`message`、または`messages`を既に取っているのでしょうか？
|
|
58
58
|
取っていないのであれば、`Message`コンポーネントの中で`message`を参照出来ないですよね。
|
|
59
59
|
|
|
60
|
-
必要であれば、`{ type: 'messages_fetch_success', payload: message }`に対応している`reducer`のコードも追記してください。不要そうであれば、そちらのコードの追記も不要です。
|
|
60
|
+
必要であれば、`{ type: 'messages_fetch_success', payload: message }`に対応している`reducer`のコードも追記してください。不要そうであれば、そちらのコードの追記も不要です。
|
|
61
|
+
|
|
62
|
+
# 追記3
|
|
63
|
+
|
|
64
|
+
```
|
|
65
|
+
componentWillMount() {
|
|
66
|
+
const room = this.props.navigation.state.params.room;
|
|
67
|
+
this.props.messagesFetch(room);
|
|
68
|
+
|
|
69
|
+
console.log('message3, message);
|
|
70
|
+
this.setState((previousState) => {
|
|
71
|
+
return {
|
|
72
|
+
messages: GiftedChat.append(previousState.messages, message),
|
|
73
|
+
};
|
|
74
|
+
});
|
|
75
|
+
}
|
|
76
|
+
```
|
|
77
|
+
|
|
78
|
+
とりあえず、`componentWillMount`内で`this.props.messagesFetch(room)`している訳ですから、このライフサイクルメソッド内で`console.log('message3, message)`のように`message`を参照しようとしても、まだ、reduxのstoreにmessage入っていないので参照出来ません。
|
|
79
|
+
|
|
80
|
+
次に、そもそものところで、追記２にも書きましたが、`mapStateToProps`内で`message`を取ってないですよね。
|
|
81
|
+
|
|
82
|
+
```
|
|
83
|
+
const mapStateToProps = (state) => {
|
|
84
|
+
const { text, user, createdAt, _id } = state.messageForm;
|
|
85
|
+
return { text, user, createdAt, _id };
|
|
86
|
+
};
|
|
87
|
+
```
|
|
88
|
+
というか話は少し本題からずれますが、ここで参照している`text`やら `user`やらは、`Message`コンポーネント内で一切使っていなくないですか？
|
|
89
|
+
|
|
90
|
+
前提として、`redux`をどれくらい理解されてますでしょうか？
|
4
a
answer
CHANGED
|
@@ -23,11 +23,38 @@
|
|
|
23
23
|
|
|
24
24
|
それと、これは単なる確認ですが、`redux/messageActions.js`を見る限り、利用しているmiddlewareは`redux-thunk`っぽいですが、それで合っていますか？
|
|
25
25
|
|
|
26
|
-
# 追記
|
|
26
|
+
# 追記1
|
|
27
27
|
```
|
|
28
28
|
return message;
|
|
29
29
|
console.log('message1', message);
|
|
30
30
|
```
|
|
31
31
|
|
|
32
32
|
いや、`console.log`の前に`return`しているので、`message1`は間違いなくログで取れないですよね？
|
|
33
|
-
今一度、状況を整理して質問内容を見直した方が良さそうですよ。
|
|
33
|
+
今一度、状況を整理して質問内容を見直した方が良さそうですよ。
|
|
34
|
+
|
|
35
|
+
# 追記2
|
|
36
|
+
|
|
37
|
+
追記の内容を確認いたしました。
|
|
38
|
+
|
|
39
|
+
`message3はエラーすら出ません`と当初ありましたが、編集後のコードのどこで`message`を参照したいのですか？
|
|
40
|
+
|
|
41
|
+
質問内容をわかりやすくするために、引き続き、`console.log(message3)`をコード内に入れてください。
|
|
42
|
+
|
|
43
|
+
```
|
|
44
|
+
.then(message => {
|
|
45
|
+
dispatch({ type: 'messages_fetch_success', payload: message });
|
|
46
|
+
console.log('message2', message);
|
|
47
|
+
});
|
|
48
|
+
```
|
|
49
|
+
`messageFetch()`関数の中で`dispatch`していますが、ここで`store`に入れたものは`Message.js`のどこで取得していますか？
|
|
50
|
+
|
|
51
|
+
```
|
|
52
|
+
const mapStateToProps = (state) => {
|
|
53
|
+
const { text, user, createdAt, _id } = state.messageForm;
|
|
54
|
+
return { text, user, createdAt, _id };
|
|
55
|
+
};
|
|
56
|
+
```
|
|
57
|
+
ここで先ほどのところで`dispatch`した`message`、または`messages`を既に取っているのでしょうか？
|
|
58
|
+
取っていないのであれば、`Message`コンポーネントの中で`message`を参照出来ないですよね。
|
|
59
|
+
|
|
60
|
+
必要であれば、`{ type: 'messages_fetch_success', payload: message }`に対応している`reducer`のコードも追記してください。不要そうであれば、そちらのコードの追記も不要です。
|
3
a
answer
CHANGED
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
|
|
22
22
|
というのも、`redux/messageActions.js`を見る限り、`messagesFetch`関数が取る引数は`room`オブジェクトのようですが、`componentDidMount`内での`messagesFetch`関数の呼び出しでは関数オブジェクトを引数に渡していますよね？
|
|
23
23
|
|
|
24
|
-
それと、`redux/messageActions.js`を見る限り、利用しているmiddlewareは`redux-thunk`っぽいですが、それで合っていますか？
|
|
24
|
+
それと、これは単なる確認ですが、`redux/messageActions.js`を見る限り、利用しているmiddlewareは`redux-thunk`っぽいですが、それで合っていますか？
|
|
25
25
|
|
|
26
26
|
# 追記
|
|
27
27
|
```
|
2
a
answer
CHANGED
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
};
|
|
20
20
|
```
|
|
21
21
|
|
|
22
|
-
というのも、`redux/messageActions.js`を見る限り、`messagesFetch`関数が取る引数は`room`オブジェクトのようですが、`componentDidMount`では関数オブジェクトを渡していますよね？
|
|
22
|
+
というのも、`redux/messageActions.js`を見る限り、`messagesFetch`関数が取る引数は`room`オブジェクトのようですが、`componentDidMount`内での`messagesFetch`関数の呼び出しでは関数オブジェクトを引数に渡していますよね？
|
|
23
23
|
|
|
24
24
|
それと、`redux/messageActions.js`を見る限り、利用しているmiddlewareは`redux-thunk`っぽいですが、それで合っていますか？
|
|
25
25
|
|
1
a
answer
CHANGED
|
@@ -21,4 +21,13 @@
|
|
|
21
21
|
|
|
22
22
|
というのも、`redux/messageActions.js`を見る限り、`messagesFetch`関数が取る引数は`room`オブジェクトのようですが、`componentDidMount`では関数オブジェクトを渡していますよね？
|
|
23
23
|
|
|
24
|
-
それと、`redux/messageActions.js`を見る限り、利用しているmiddlewareは`redux-thunk`っぽいですが、それで合っていますか？
|
|
24
|
+
それと、`redux/messageActions.js`を見る限り、利用しているmiddlewareは`redux-thunk`っぽいですが、それで合っていますか？
|
|
25
|
+
|
|
26
|
+
# 追記
|
|
27
|
+
```
|
|
28
|
+
return message;
|
|
29
|
+
console.log('message1', message);
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
いや、`console.log`の前に`return`しているので、`message1`は間違いなくログで取れないですよね？
|
|
33
|
+
今一度、状況を整理して質問内容を見直した方が良さそうですよ。
|