質問編集履歴
1
formではなく、登録ボタンクリック次に呼び出すようにした
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
|
|
33
33
|
|
|
34
34
|
|
|
35
|
-
### 該当のソースコード
|
|
35
|
+
### 該当のソースコード（変更前）
|
|
36
36
|
|
|
37
37
|
|
|
38
38
|
|
|
@@ -256,6 +256,246 @@
|
|
|
256
256
|
|
|
257
257
|
```
|
|
258
258
|
|
|
259
|
+
#変更後(formではなく、変更ボタンクリック次に呼び出すようにした)
|
|
260
|
+
|
|
261
|
+
|
|
262
|
+
|
|
263
|
+
```react
|
|
264
|
+
|
|
265
|
+
function Setting() {
|
|
266
|
+
|
|
267
|
+
const [state, setState] = useState({
|
|
268
|
+
|
|
269
|
+
name: "",
|
|
270
|
+
|
|
271
|
+
old: "",
|
|
272
|
+
|
|
273
|
+
weight: "",
|
|
274
|
+
|
|
275
|
+
height: "",
|
|
276
|
+
|
|
277
|
+
introduction: "",
|
|
278
|
+
|
|
279
|
+
fat_percentage: "",
|
|
280
|
+
|
|
281
|
+
bmi: "",
|
|
282
|
+
|
|
283
|
+
});
|
|
284
|
+
|
|
285
|
+
const handleChange = event => {
|
|
286
|
+
|
|
287
|
+
console.log(event.target.name)
|
|
288
|
+
|
|
289
|
+
setState({ ...state, [event.target.name]: event.target.value });
|
|
290
|
+
|
|
291
|
+
}
|
|
292
|
+
|
|
293
|
+
function calcBMI() {
|
|
294
|
+
|
|
295
|
+
const height_m = state.height / 100;
|
|
296
|
+
|
|
297
|
+
var total = parseFloat(state.weight / (height_m * height_m));
|
|
298
|
+
|
|
299
|
+
const BMI = Math.round(total);
|
|
300
|
+
|
|
301
|
+
const newState = { ...state, bmi: BMI };
|
|
302
|
+
|
|
303
|
+
setState(newState);
|
|
304
|
+
|
|
305
|
+
console.log(state);
|
|
306
|
+
|
|
307
|
+
}
|
|
308
|
+
|
|
309
|
+
function handleSubmit() {
|
|
310
|
+
|
|
311
|
+
const currentUser = firebase.auth().currentUser;
|
|
312
|
+
|
|
313
|
+
calcBMI();
|
|
314
|
+
|
|
315
|
+
}
|
|
316
|
+
|
|
317
|
+
return (
|
|
318
|
+
|
|
319
|
+
<React.Fragment>
|
|
320
|
+
|
|
321
|
+
<SchemerAppBar title="Setting" />
|
|
322
|
+
|
|
323
|
+
<Container>
|
|
324
|
+
|
|
325
|
+
<Button
|
|
326
|
+
|
|
327
|
+
color="default"
|
|
328
|
+
|
|
329
|
+
variant="contained"
|
|
330
|
+
|
|
331
|
+
onClick={() => history.goBack()}
|
|
332
|
+
|
|
333
|
+
style={{ marginTop: 20 }}
|
|
334
|
+
|
|
335
|
+
>戻る
|
|
336
|
+
|
|
337
|
+
</Button>
|
|
338
|
+
|
|
339
|
+
<Grid>
|
|
340
|
+
|
|
341
|
+
<TextField name="name" width="180" label="名前" value={state.name} onChange={handleChange} style={{ marginRight: 20 }}></TextField>
|
|
342
|
+
|
|
343
|
+
<TextField
|
|
344
|
+
|
|
345
|
+
width="150"
|
|
346
|
+
|
|
347
|
+
label="年齢"
|
|
348
|
+
|
|
349
|
+
name="old"
|
|
350
|
+
|
|
351
|
+
value={state.old}
|
|
352
|
+
|
|
353
|
+
onChange={handleChange}
|
|
354
|
+
|
|
355
|
+
InputProps={{
|
|
356
|
+
|
|
357
|
+
endAdornment: <InputAdornment position="end">歳</InputAdornment>,
|
|
358
|
+
|
|
359
|
+
}}></TextField>
|
|
360
|
+
|
|
361
|
+
</Grid>
|
|
362
|
+
|
|
363
|
+
<Grid>
|
|
364
|
+
|
|
365
|
+
<TextField
|
|
366
|
+
|
|
367
|
+
name="height"
|
|
368
|
+
|
|
369
|
+
width="100"
|
|
370
|
+
|
|
371
|
+
label="身長"
|
|
372
|
+
|
|
373
|
+
value={state.height}
|
|
374
|
+
|
|
375
|
+
style={{ marginRight: 20 }}
|
|
376
|
+
|
|
377
|
+
onChange={handleChange}
|
|
378
|
+
|
|
379
|
+
InputProps={{
|
|
380
|
+
|
|
381
|
+
endAdornment: <InputAdornment>cm</InputAdornment>,
|
|
382
|
+
|
|
383
|
+
}}></TextField>
|
|
384
|
+
|
|
385
|
+
<TextField
|
|
386
|
+
|
|
387
|
+
width="100"
|
|
388
|
+
|
|
389
|
+
label="体重"
|
|
390
|
+
|
|
391
|
+
name="weight"
|
|
392
|
+
|
|
393
|
+
value={state.weight}
|
|
394
|
+
|
|
395
|
+
onChange={handleChange}
|
|
396
|
+
|
|
397
|
+
InputProps={{
|
|
398
|
+
|
|
399
|
+
endAdornment: <InputAdornment>Kg</InputAdornment>,
|
|
400
|
+
|
|
401
|
+
}}
|
|
402
|
+
|
|
403
|
+
></TextField>
|
|
404
|
+
|
|
405
|
+
<TextField
|
|
406
|
+
|
|
407
|
+
width="100"
|
|
408
|
+
|
|
409
|
+
label="体脂肪率"
|
|
410
|
+
|
|
411
|
+
name="fat_percentage"
|
|
412
|
+
|
|
413
|
+
value={state.fat_percentage}
|
|
414
|
+
|
|
415
|
+
onChange={handleChange}
|
|
416
|
+
|
|
417
|
+
style={{ marginRight: 20, marginLeft: 20 }}
|
|
418
|
+
|
|
419
|
+
InputProps={{
|
|
420
|
+
|
|
421
|
+
endAdornment: <InputAdornment>%</InputAdornment>,
|
|
422
|
+
|
|
423
|
+
}}
|
|
424
|
+
|
|
425
|
+
></TextField>
|
|
426
|
+
|
|
427
|
+
</Grid>
|
|
428
|
+
|
|
429
|
+
<Grid>
|
|
430
|
+
|
|
431
|
+
<InputLabel style={{ marginTop: 20 }}>詳細</InputLabel>
|
|
432
|
+
|
|
433
|
+
<TextField
|
|
434
|
+
|
|
435
|
+
name="introduction"
|
|
436
|
+
|
|
437
|
+
width="400"
|
|
438
|
+
|
|
439
|
+
multiline rows={4}
|
|
440
|
+
|
|
441
|
+
variant="outlined"
|
|
442
|
+
|
|
443
|
+
value={state.introduction}
|
|
444
|
+
|
|
445
|
+
fullWidth
|
|
446
|
+
|
|
447
|
+
onChange={handleChange}
|
|
448
|
+
|
|
449
|
+
variant="outlined"
|
|
450
|
+
|
|
451
|
+
>
|
|
452
|
+
|
|
453
|
+
</TextField>
|
|
454
|
+
|
|
455
|
+
</Grid>
|
|
456
|
+
|
|
457
|
+
<Grid container justify="space-between">
|
|
458
|
+
|
|
459
|
+
<Grid item>
|
|
460
|
+
|
|
461
|
+
</Grid>
|
|
462
|
+
|
|
463
|
+
<Grid item>
|
|
464
|
+
|
|
465
|
+
<Button
|
|
466
|
+
|
|
467
|
+
color="primary"
|
|
468
|
+
|
|
469
|
+
variant="contained"
|
|
470
|
+
|
|
471
|
+
style={{ marginTop: 20 }}
|
|
472
|
+
|
|
473
|
+
value="Submit"
|
|
474
|
+
|
|
475
|
+
type="submit"
|
|
476
|
+
|
|
477
|
+
onClick={handleSubmit}
|
|
478
|
+
|
|
479
|
+
>
|
|
480
|
+
|
|
481
|
+
登録する</Button>
|
|
482
|
+
|
|
483
|
+
</Grid>
|
|
484
|
+
|
|
485
|
+
</Grid>
|
|
486
|
+
|
|
487
|
+
<LabelBottomNavigation />
|
|
488
|
+
|
|
489
|
+
</Container>
|
|
490
|
+
|
|
491
|
+
</React.Fragment>
|
|
492
|
+
|
|
493
|
+
);
|
|
494
|
+
|
|
495
|
+
}
|
|
496
|
+
|
|
497
|
+
```
|
|
498
|
+
|
|
259
499
|
|
|
260
500
|
|
|
261
501
|
### 試したこと
|