vuejs

Class and Style Bindings 88
Tip
To actually use a class name instead of a variable inside classes array, use single quotes.
v-bind:class="[ variable, 'classname']"
7.2 Style binding
7.2.1 Object Syntax
The Object syntax for v-bind:style is pretty straightforward; it looks almost like CSS, except it’s a
JavaScript object. We are going to use the shorthand Vue.js provides for the previously used directive,
v-bind(:).
1
2
1 data: {
2 niceStyle:
3 {
4 color: 'blue',
5 fontSize: '20px'
6 }
7 }
We can also declare the style properties inside an object :style=”…“ inline.
1
We can even reference variables inside style object:
1
2
3