質問するログイン新規登録

質問編集履歴

5

質問の解答

2019/11/14 00:14

投稿

aiai8976
aiai8976

スコア112

title CHANGED
File without changes
body CHANGED
@@ -62,6 +62,8 @@
62
62
  ?????の部分に
63
63
  `${category.icon}`を入れてみましたがダメでした。
64
64
 
65
+ 最新のプログラム
66
+
65
67
  ```
66
68
  export default function CustomizedMenus({ categories, onClick }) {
67
69
  const [anchorEl, setAnchorEl] = React.useState(null);
@@ -98,13 +100,13 @@
98
100
  open={Boolean(anchorEl)}
99
101
  onClose={handleClose}
100
102
  >
101
- {categories.map(category => (
103
+ {categories.map(category => {
102
104
  const TagName = category.icon;
103
- <StyledMenuItem onClick={() => onClick(to(category))}> ##エラー該当箇所
105
+ <StyledMenuItem onClick={() => onClick(to(category))}>##該当箇所
104
106
  <ListItemIcon>
105
107
  <TagName fontsize="small" />
106
108
  </ListItemIcon>
107
109
  <ListItemText primary={category.name} />
108
110
  </StyledMenuItem>
109
- ))}
111
+ })}
110
112
  ```

4

質問の解答

2019/11/14 00:14

投稿

aiai8976
aiai8976

スコア112

title CHANGED
File without changes
body CHANGED
@@ -4,6 +4,17 @@
4
4
  以下のようにタグが繰り返しになるのでmap関数を使って変更したいと思っています。
5
5
  わかる方がいましたらコメントお願いします。
6
6
 
7
+ ###エラー
8
+ ```
9
+ Failed to compile.
10
+
11
+ ./src/components/CustomizedMenus.js
12
+ Line 83:11: Expected an assignment or function call and instead saw an expression no-unused-expressions
13
+
14
+ Search for the keywords to learn more about each error.
15
+ ```
16
+
17
+
7
18
  ### 該当のソースコード
8
19
  変更前
9
20
  ```ここに言語名を入力
@@ -89,7 +100,7 @@
89
100
  >
90
101
  {categories.map(category => (
91
102
  const TagName = category.icon;
92
- <StyledMenuItem onClick={() => onClick(to(category))}>
103
+ <StyledMenuItem onClick={() => onClick(to(category))}> ##エラー該当箇所
93
104
  <ListItemIcon>
94
105
  <TagName fontsize="small" />
95
106
  </ListItemIcon>

3

質問の解答

2019/11/13 23:57

投稿

aiai8976
aiai8976

スコア112

title CHANGED
File without changes
body CHANGED
@@ -52,7 +52,35 @@
52
52
  `${category.icon}`を入れてみましたがダメでした。
53
53
 
54
54
  ```
55
+ export default function CustomizedMenus({ categories, onClick }) {
56
+ const [anchorEl, setAnchorEl] = React.useState(null);
57
+
58
+ const handleClick = event => {
59
+ setAnchorEl(event.currentTarget);
60
+ };
61
+
62
+ const handleClose = () => {
63
+ setAnchorEl(null);
64
+ };
65
+
66
+ const to = category => (
67
+ category.id === '1'
68
+ ? `/all`
69
+ : `/category/${category.id}`
70
+ );
71
+
72
+ return (
73
+ <div>
74
+ <Button
75
+ aria-controls="customized-menu"
76
+ aria-haspopup="true"
77
+ variant="contained"
78
+ color="primary"
79
+ onClick={handleClick}
80
+ >
81
+ ボタン
82
+ </Button>
55
- <StyledMenu
83
+ <StyledMenu
56
84
  id="customized-menu"
57
85
  anchorEl={anchorEl}
58
86
  keepMounted
@@ -60,7 +88,7 @@
60
88
  onClose={handleClose}
61
89
  >
62
90
  {categories.map(category => (
63
- const TagName=`${category.icon}`; ////////文法エラー
91
+ const TagName = category.icon;
64
92
  <StyledMenuItem onClick={() => onClick(to(category))}>
65
93
  <ListItemIcon>
66
94
  <TagName fontsize="small" />

2

質問の解答

2019/11/12 03:48

投稿

aiai8976
aiai8976

スコア112

title CHANGED
File without changes
body CHANGED
@@ -35,7 +35,18 @@
35
35
  ))}
36
36
  ```
37
37
 
38
+ state
39
+ ```
40
+ const initialState = {
41
+ categories: [
42
+ {
43
+ id: '1',
44
+ name: 'テレビ',
45
+ icon: 'CreateIcon'
46
+ },
47
+ ```
38
48
 
49
+
39
50
  ### 試したこと
40
51
  ?????の部分に
41
52
  `${category.icon}`を入れてみましたがダメでした。

1

質問の解答

2019/11/12 02:07

投稿

aiai8976
aiai8976

スコア112

title CHANGED
File without changes
body CHANGED
@@ -38,4 +38,23 @@
38
38
 
39
39
  ### 試したこと
40
40
  ?????の部分に
41
- `${category.icon}`を入れてみましたがダメでした。
41
+ `${category.icon}`を入れてみましたがダメでした。
42
+
43
+ ```
44
+ <StyledMenu
45
+ id="customized-menu"
46
+ anchorEl={anchorEl}
47
+ keepMounted
48
+ open={Boolean(anchorEl)}
49
+ onClose={handleClose}
50
+ >
51
+ {categories.map(category => (
52
+ const TagName=`${category.icon}`; ////////文法エラー
53
+ <StyledMenuItem onClick={() => onClick(to(category))}>
54
+ <ListItemIcon>
55
+ <TagName fontsize="small" />
56
+ </ListItemIcon>
57
+ <ListItemText primary={category.name} />
58
+ </StyledMenuItem>
59
+ ))}
60
+ ```