質問編集履歴
1
３項演算子を使ったやり方でできましたが、標準のやり方かどうかわかりません。
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -3,6 +3,14 @@
|
|
|
3
3
|
vue.js で v-for で v-bind:class を切替えたいと思い下記のコードを書きました。
|
|
4
4
|
|
|
5
5
|
2列のtd を出力していますが、一部のTDにのみ class 属性を付けたいのですがうまくいきません。
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
追記：書き方を変えてうまくいきましたが、下記のやり方では、
|
|
10
|
+
|
|
11
|
+
<td class> となってしまいます。
|
|
12
|
+
|
|
13
|
+
|
|
6
14
|
|
|
7
15
|
###期待するHTML
|
|
8
16
|
|
|
@@ -32,7 +40,13 @@
|
|
|
32
40
|
|
|
33
41
|
<tr v-for="student in students">
|
|
34
42
|
|
|
43
|
+
### 初回質問時
|
|
44
|
+
|
|
35
45
|
<td v-for="(value, key) in columns" v-bind:class="{student-outer: key==='student_name'}">
|
|
46
|
+
|
|
47
|
+
### 質問更新時
|
|
48
|
+
|
|
49
|
+
<td v-for="(value, key) in columns" v-bind:class="[key==='student_name' ? 'student_outer' : '']">
|
|
36
50
|
|
|
37
51
|
{{ student[key] }}
|
|
38
52
|
|