質問編集履歴

5

コードの変更

2020/11/27 06:35

投稿

maskmelon
maskmelon

スコア63

test CHANGED
File without changes
test CHANGED
@@ -58,6 +58,10 @@
58
58
 
59
59
  ```tsx
60
60
 
61
+ import { TextField } from '@material-ui/core'
62
+
63
+
64
+
61
65
  export const Component: React.FC = () => {
62
66
 
63
67
  const [title,setTitle] = React.useState<string>('')

4

追記

2020/11/27 06:35

投稿

maskmelon
maskmelon

スコア63

test CHANGED
File without changes
test CHANGED
@@ -26,11 +26,11 @@
26
26
 
27
27
 
28
28
 
29
- ```js
29
+ ```tsx
30
30
 
31
- export const Component = () => {
31
+ export const Component: React.FC = () => {
32
32
 
33
- const [open, setOpen] = React.useState(false)
33
+ const [open, setOpen] = React.useState<boolean>(false)
34
34
 
35
35
  const handleOpen = React.useCallback(() => {
36
36
 
@@ -56,4 +56,48 @@
56
56
 
57
57
 
58
58
 
59
+ ```tsx
60
+
61
+ export const Component: React.FC = () => {
62
+
63
+ const [title,setTitle] = React.useState<string>('')
64
+
65
+
66
+
67
+ const handleLabelInput = React.useCallback(
68
+
69
+ (e: React.ChangeEvent<HTMLInputElement>) => {
70
+
71
+ setLabel(e.currentTarget.value);
72
+
73
+ },
74
+
75
+ []
76
+
77
+ );
78
+
79
+ return (
80
+
81
+ <TextField
82
+
83
+ label="title"
84
+
85
+ variant="outlined"
86
+
87
+ margin="dense"
88
+
89
+ fullWidth
90
+
91
+ onChange={handleTitleInput}
92
+
93
+ />
94
+
95
+ );
96
+
97
+ }
98
+
99
+ ```
100
+
101
+
102
+
59
103
  ご存知の方いらっしゃいましたらご教授いただけると幸いです。よろしくお願いいたします。

3

言い回しの変更

2020/11/27 06:34

投稿

maskmelon
maskmelon

スコア63

test CHANGED
File without changes
test CHANGED
@@ -52,7 +52,7 @@
52
52
 
53
53
 
54
54
 
55
- またそれはMaterial-ui等のCSSフレームワークから提供されるButtonコンポーネントやTextFieldコンポーネントについても同様でしょうか?(それらのコンポーネントがメモ化されているかどうか自力でソースを見つけることができませんでした)
55
+ またそれはMaterial-UI等のCSSフレームワークから提供されるButtonコンポーネントやTextFieldコンポーネントについても同様でしょうか?(それらのコンポーネントがメモ化されているかどうか自力でソースを見つけることができませんでした)
56
56
 
57
57
 
58
58
 

2

言い回しの変更

2020/11/27 06:26

投稿

maskmelon
maskmelon

スコア63

test CHANGED
File without changes
test CHANGED
@@ -12,7 +12,7 @@
12
12
 
13
13
 
14
14
 
15
- - useCallbackでラップすることで、コールバック関数はuseCallbackの依存配列に変化がない限り同一オブジェクトとして判定されるため、子コンポーネントのpropsは変化せず、親コンポーネントが再レンダリングされても子コンポーネントは再レンダリングされない
15
+ - useCallbackでラップされたコールバック関数は依存配列に変化がない限り同一オブジェクトとして判定されるため、子コンポーネントのpropsは変化せず、親コンポーネントが再レンダリングされても子コンポーネントは再レンダリングされない
16
16
 
17
17
 
18
18
 

1

誤字

2020/11/27 06:25

投稿

maskmelon
maskmelon

スコア63

test CHANGED
File without changes
test CHANGED
@@ -8,7 +8,7 @@
8
8
 
9
9
 
10
10
 
11
- - propsとして渡されたコールバック関数は親コンポーネントが再レンダリングされるたびに別のオブジェクトとして判定されるため、子コンポーントはmemo化されていてもやはり再レンダリングされる
11
+ - propsとして渡されたコールバック関数は親コンポーネントが再レンダリングされるたびに別のオブジェクトとして判定されるため、子コンポーントはmemo化されていてもやはり再レンダリングされる
12
12
 
13
13
 
14
14