質問編集履歴

2

誤記の修正

2020/07/29 03:12

投稿

takashun
takashun

スコア1

test CHANGED
File without changes
test CHANGED
@@ -192,7 +192,7 @@
192
192
 
193
193
  <option value="0" selected>--リストを選択--</option>
194
194
 
195
- <option v-for="n in 10" v-bind:value="n">リスト{{n}}</option>
195
+ <option v-for="n in 5" v-bind:value="n">リスト{{n}}</option>
196
196
 
197
197
  </select>
198
198
 
@@ -204,11 +204,11 @@
204
204
 
205
205
  <option value="0" selected>--リストを選択--</option>
206
206
 
207
- <option v-for="n in 10" v-bind:value="n">リスト{{n}}</option>
207
+ <option v-for="n in 5" v-bind:value="n">リスト{{n}}</option>
208
208
 
209
209
  </select></p>
210
210
 
211
- <ul v-for="n in 10" v-bind:value="n">リスト{{n}}
211
+ <ul v-for="n in 5" v-bind:value="n">リスト{{n}}
212
212
 
213
213
  <div v-if="hasRight && selectBoxValue > 1">
214
214
 

1

テンプレート全体部分を記載

2020/07/29 03:12

投稿

takashun
takashun

スコア1

test CHANGED
File without changes
test CHANGED
@@ -114,19 +114,107 @@
114
114
 
115
115
 
116
116
 
117
- ###私が実装しているグル処理の箇所
117
+ ###追記:テンプレー全体部分
118
-
119
- こちらのまま実行すると、現在の実行結果になります。
118
+
120
-
121
- ```
119
+ ```
120
+
122
-
121
+ <div class="contents" v-else-if="isActive === '4'">
122
+
123
+ <p>
124
+
125
+ <select v-model="selectBoxValue" v-on:change="changeAlertList" class="round">
126
+
127
+ <option v-for="(label,id) in selectBoxOptions" :value="id">{{ label }}</option>
128
+
129
+ </select>
130
+
131
+ </p>
132
+
133
+ <div v-if="isLoading">
134
+
123
- <ul v-for="n in 5" v-bind:value="n">リスト{{n}}
135
+ <img src="img/load.gif" />
136
+
124
-
137
+ </div>
138
+
139
+
140
+
141
+ <label>===一括ON/OFF===</label>
142
+
143
+
144
+
145
+ <div v-if="!isLoading">
146
+
147
+ <p v-if="isToggled==true && selectBoxValue > 1" class="error">
148
+
149
+ トグルON:失敗
150
+
151
+ </p>
152
+
153
+ <p v-if="isToggled==false && selectBoxValue > 1" class="msg">
154
+
155
+ トグルOFF:成功
156
+
157
+ </p>
158
+
125
- <div v-if="hasRight && selectBoxValue > 1">
159
+ <div v-if="hasRight && selectBoxValue > 1">
160
+
161
+ <label class="switch__label">
162
+
163
+ <input type="checkbox" class="switch__input" v-model="isToggled" v-on:change="changeToggle" />
164
+
165
+ <span class="switch__content"></span>
166
+
167
+ <span class="switch__circle"></span>
168
+
169
+ </label>
170
+
171
+ </div>
172
+
173
+ <div v-if="!hasRight && selectBoxValue > 1">
174
+
175
+ <label class="switch__label">
176
+
177
+ <input type="checkbox" class="switch__input" v-model="isToggled" disabled />
178
+
179
+ <span class="switch__content"></span>
180
+
181
+ <span class="switch__circle"></span>
182
+
183
+ </label>
184
+
185
+ <p class="error">※メッセージ</p>
186
+
187
+ </div>
188
+
189
+
190
+
191
+ <p><select v-model="opelist" v-on:change="changeList">
192
+
193
+ <option value="0" selected>--リストを選択--</option>
194
+
195
+ <option v-for="n in 10" v-bind:value="n">リスト{{n}}</option>
196
+
197
+ </select>
198
+
199
+
200
+
201
+ <label>===リストの表示===</label>
202
+
203
+ <p><select v-model="opelist" v-on:change="changeList">
204
+
205
+ <option value="0" selected>--リストを選択--</option>
206
+
207
+ <option v-for="n in 10" v-bind:value="n">リスト{{n}}</option>
208
+
209
+ </select></p>
210
+
211
+ <ul v-for="n in 10" v-bind:value="n">リスト{{n}}
212
+
213
+ <div v-if="hasRight && selectBoxValue > 1">
126
214
 
127
215
  <label class="switch__label">
128
216
 
129
- <input type="checkbox" class="switch__input" v-model="isToggle" v-on:change="changeToggle" />
217
+ <input type="checkbox" class="switch__input" v-model="isToggled[n-1]" v-on:change="changeToggle(n-1)" />
130
218
 
131
219
  <span class="switch__content"></span>
132
220
 
@@ -140,7 +228,7 @@
140
228
 
141
229
  <label class="switch__label">
142
230
 
143
- <input type="checkbox" class="switch__input" v-model="isToggle" disabled />
231
+ <input type="checkbox" class="switch__input" v-model="isToggled[n-1]" disabled />
144
232
 
145
233
  <span class="switch__content"></span>
146
234
 
@@ -150,7 +238,11 @@
150
238
 
151
239
  </div>
152
240
 
153
- </ul>
241
+ </ul>
242
+
243
+ </div>
244
+
245
+ </div>
154
246
 
155
247
 
156
248