vue基础-动态class

vue基础-动态class

    • 1、目标
    • 2、语法

1、目标

用v-bind给标签class设置动态值

2、语法

:class = "{类名:布尔值}"

示例:

<template>
  <div id="app">

    <div>
      <!--:class="{类名:布尔值}"-->
      <!--使用场景 控制标签是否应该有类名-->
      <p :class="{red_tsr:bool}">动态class</p>
    </div>
    
   
  </div>
  
</template>

<script>
export default {
  data(){
    return{
      bool:true
    }
  }
}
</script>

<style>
.red_tsr{
  color: red;
}

</style>

你可能感兴趣的:(#,vue基础,vue.js,javascript,ecmascript)