Vue学习笔记:v-bind 属性动态绑定

v-bind 的作用

v-bind指令可以将节点的属性与动态表达式绑定在一起

v-bind可以绑定html元素中的各种属性

例如:

<a v-bind:href="xxx"></a>

xxx可以是data里的变量,也可以是函数等等

语法糖

v-bind可以简写成 :
v-bind:xxx 简写成 :xxx

class属性动态绑定

常见的写法:class可以绑定一个放着类名的数组,也可以绑定一个对象,或者对象也可以放在数组中
对象中,键表示类名,值表示这个类是否进行启用

  • :class="['a', 'b', 'c']"
  • :class="['a', 'b', {k1:v1, k2:v2}]"
  • :class="{k1:v1, k2:v2}"
  • :class="obj"

~~~~~ END ~~~~~

猜你喜欢

转载自www.cnblogs.com/wbyixx/p/11963496.html