teratail
回答率
85.48%
質問するログイン新規登録
トップに関する質問reducerのfunctionを動かしたい（redux）

編集履歴

質問編集履歴

2

UserCreateをアップデートしました

2018/06/30 08:33

投稿

yamady
yamady

スコア176

test CHANGED
File without changes
test CHANGED
@@ -110,11 +110,99 @@
110
110
 
111
111
  ```JavaScript
112
112
 
113
+ class CreditCard extends React.Component {
114
+
115
+ state = {
116
+
117
+ showModal: false,
118
+
119
+ error: null
120
+
121
+ };
122
+
123
+
124
+
125
+ static navigationOptions = ({ navigation }) => {
126
+
127
+ const { params = {} } = navigation.state;
128
+
129
+ return {
130
+
131
+ headerTitle: 'ユーザーの新規作成',
132
+
133
+ headerLeft: (
134
+
135
+ <TouchableOpacity
136
+
137
+ onPress={()=> navigation.goBack()}
138
+
139
+ style={styles.headerIcon}
140
+
113
- ・・・
141
+ >
142
+
114
-
143
+ <Icon name='chevron-left' size={28} style={{color: '#fff'}}/>
144
+
145
+ </TouchableOpacity>
146
+
147
+ ),
148
+
149
+ headerRight: (
150
+
151
+ <TouchableOpacity
152
+
153
+ onPress={() => params.handleSave()}
154
+
155
+ >
156
+
157
+ <Text style={styles.headerBtn}>{I18n.t('save')}</Text>
158
+
159
+ </TouchableOpacity>
160
+
161
+ ),
162
+
163
+ headerStyle: {
164
+
165
+ backgroundColor: Theme.PRIMARY,
166
+
167
+ },
168
+
169
+ headerTitleStyle: {
170
+
171
+ color: '#fff',
172
+
173
+ fontWeight: 'bold'
174
+
175
+ }
176
+
177
+ };
178
+
179
+ };
180
+
181
+
182
+
183
+ onButtonPress() {
184
+
185
+ const { firstName, lastName } = this.props;
186
+
187
+
188
+
189
+ this.props.userCreate({ firstName, lastName });
190
+
191
+ }
192
+
193
+
194
+
115
- componentWillMount() {
195
+ componentDidMount() {
196
+
116
-
197
+ this.props.navigation.setParams({ handleSave: this.onButtonPress.bind(this) });
198
+
199
+ }
200
+
201
+
202
+
203
+ render() {
204
+
117
- if(this.props.failedModal === true) {
205
+ if(this.props.error === true) {
118
206
 
119
207
  Alert.alert(
120
208
 
@@ -134,9 +222,55 @@
134
222
 
135
223
  }
136
224
 
225
+
226
+
227
+ return (
228
+
229
+ <View>
230
+
231
+ <TextInput
232
+
233
+ value={this.props.firstName}
234
+
235
+ onChangeText={value => this.props.userUpdate({ prop: 'firstName', value })}
236
+
237
+ />
238
+
239
+ <Input
240
+
241
+ value={this.props.lastName}
242
+
243
+ onChangeText={value => this.props.userUpdate({ prop: 'lastName', value })}
244
+
245
+ />
246
+
247
+ </View>
248
+
249
+ );
250
+
137
- }
251
+ }
252
+
138
-
253
+ }
254
+
255
+
256
+
257
+ const mapStateToProps = (state) => {
258
+
259
+ const { firstName, lastName } = state.userForm;
260
+
261
+
262
+
263
+ return { firstName, lastName };
264
+
139
- ・・・
265
+ };
266
+
267
+
268
+
269
+ export default connect(mapStateToProps, {
270
+
271
+ userUpdate, userCreate
272
+
273
+ })(UserCreate);
140
274
 
141
275
  ```
142
276
 

1

ソースコードを更新しました

2018/06/30 08:33

投稿

yamady
yamady

スコア176

test CHANGED
File without changes
test CHANGED
@@ -88,7 +88,7 @@
88
88
 
89
89
  case 'USER_SAVE_FAIL':
90
90
 
91
- return onError();
91
+ return { ...state, failedModal: true };
92
92
 
93
93
  default:
94
94
 
@@ -112,21 +112,27 @@
112
112
 
113
113
  ・・・
114
114
 
115
- onError() {
115
+ componentWillMount() {
116
116
 
117
- Alert.alert(
117
+ if(this.props.failedModal === true) {
118
118
 
119
- 'エラーが発生しました',
119
+ Alert.alert(
120
120
 
121
- [
121
+ 'エラーが発生しました',
122
122
 
123
- {text: I18n.t('cancel'), onPress: () => console.log('Cancel Pressed'), style: 'cancel'},
123
+ [
124
124
 
125
- ],
125
+ {text: 'キャンセル', onPress: () => console.log('Cancel Pressed'), style: 'cancel'},
126
126
 
127
- { cancelable: false }
127
+ {text: 'はい', onPress: () => this.onConfirmReport()},
128
128
 
129
+ ],
130
+
131
+ { cancelable: false }
132
+
129
- )
133
+ )
134
+
135
+ }
130
136
 
131
137
  }
132
138