質問編集履歴
6
微修正
test
CHANGED
File without changes
|
test
CHANGED
@@ -258,33 +258,17 @@
|
|
258
258
|
|
259
259
|
openModal(id) {
|
260
260
|
|
261
|
+
Object.keys(this.isShow).forEach(key => {
|
262
|
+
|
261
|
-
|
263
|
+
if (key === id) {
|
262
|
-
|
263
|
-
|
264
|
+
|
264
|
-
|
265
|
-
this.isShow.id01 = !this.isShow.id01;
|
266
|
-
|
267
|
-
this.isAgreed
|
265
|
+
this.isAgreed[key] = true;
|
268
|
-
|
269
|
-
|
266
|
+
|
270
|
-
|
271
|
-
case "id02":
|
272
|
-
|
273
|
-
this.isShow
|
267
|
+
this.isShow[key] = !this.isShow[key];
|
274
|
-
|
275
|
-
|
268
|
+
|
276
|
-
|
277
|
-
break;
|
278
|
-
|
279
|
-
case "id03":
|
280
|
-
|
281
|
-
this.isShow.id03 = !this.isShow.id03;
|
282
|
-
|
283
|
-
this.isAgreed.id03 = true;
|
284
|
-
|
285
|
-
break;
|
286
|
-
|
287
|
-
}
|
269
|
+
}
|
270
|
+
|
271
|
+
});
|
288
272
|
|
289
273
|
},
|
290
274
|
|
5
微修正
test
CHANGED
File without changes
|
test
CHANGED
@@ -70,6 +70,12 @@
|
|
70
70
|
|
71
71
|
現在はjsonから取得するidを3つに設定しているため、少しすっきりして見えますが、idを10個など取得すると、かなり可読性の悪いコードになってしまっています。
|
72
72
|
|
73
|
+
|
74
|
+
|
75
|
+
**追記**
|
76
|
+
|
77
|
+
だんだん短くなってきました...!
|
78
|
+
|
73
79
|
```vue
|
74
80
|
|
75
81
|
<template>
|
4
微修正
test
CHANGED
File without changes
|
test
CHANGED
@@ -114,30 +114,14 @@
|
|
114
114
|
|
115
115
|
|
116
116
|
|
117
|
-
<div v-if="id ==
|
117
|
+
<div v-if="id == id">
|
118
|
-
|
118
|
+
|
119
|
-
<p v-if="!isAgreed
|
119
|
+
<p v-if="!isAgreed[id]">Not agree</p>
|
120
|
-
|
120
|
+
|
121
|
-
<p v-if="isAgreed
|
121
|
+
<p v-if="isAgreed[id]" class="isAgreed">Agreed</p>
|
122
122
|
|
123
123
|
</div>
|
124
124
|
|
125
|
-
<div v-if="id == 'id02'">
|
126
|
-
|
127
|
-
<p v-if="!isAgreed.id02">Not agree</p>
|
128
|
-
|
129
|
-
<p v-if="isAgreed.id02" class="isAgreed">Agreed</p>
|
130
|
-
|
131
|
-
</div>
|
132
|
-
|
133
|
-
<div v-if="id == 'id03'">
|
134
|
-
|
135
|
-
<p v-if="!isAgreed.id03">Not agree</p>
|
136
|
-
|
137
|
-
<p v-if="isAgreed.id03" class="isAgreed">Agreed</p>
|
138
|
-
|
139
|
-
</div>
|
140
|
-
|
141
125
|
|
142
126
|
|
143
127
|
</li>
|
3
微修正
test
CHANGED
File without changes
|
test
CHANGED
@@ -300,11 +300,11 @@
|
|
300
300
|
|
301
301
|
closeModal() {
|
302
302
|
|
303
|
+
Object.keys(this.isShow).forEach(key => {
|
304
|
+
|
303
|
-
this.isShow.i
|
305
|
+
if (this.isShow[key] === true) this.isShow[key] = false;
|
304
|
-
|
306
|
+
|
305
|
-
|
307
|
+
});
|
306
|
-
|
307
|
-
this.isShow.id03 = false;
|
308
308
|
|
309
309
|
}
|
310
310
|
|
2
追加
test
CHANGED
File without changes
|
test
CHANGED
@@ -66,6 +66,10 @@
|
|
66
66
|
|
67
67
|
**親コンポーネント**
|
68
68
|
|
69
|
+
以下コードで、特に繰り返しになってしまっている記述についてどうにか省略できないか考えております。
|
70
|
+
|
71
|
+
現在はjsonから取得するidを3つに設定しているため、少しすっきりして見えますが、idを10個など取得すると、かなり可読性の悪いコードになってしまっています。
|
72
|
+
|
69
73
|
```vue
|
70
74
|
|
71
75
|
<template>
|
1
微修正
test
CHANGED
File without changes
|
test
CHANGED
@@ -28,7 +28,7 @@
|
|
28
28
|
|
29
29
|
|
30
30
|
|
31
|
-
**
|
31
|
+
**期待している挙動**
|
32
32
|
|
33
33
|
- 各カードをクリックすると、対応したコンポーネント(モーダル)を表示。
|
34
34
|
|