vue3元素标签属性的绑定

<template>
 <div v-bind:id="main" v-bind:class="message">aaa</div>
</template>

<script>
 export default{
     data(){
         return{
             message:'active',
             main:'mainid'
         }
     }
 }
</script>

简写形式 可以省略v-bind

<template>
 <div :id="main" :class="message">aaa</div>
</template>

<script>
 export default{
     data(){
         return{
             message:'active',
             main:'mainid'
         }
     }
 }
</script>

还可以写成对象形式

<template>
 <div v-bind="obj">aaabb</div>
</template>

<script>
 export default{
     data(){
         return{
            
             obj:{
                class:'active',
                id:'mainid',
             }
         }
     }
 }
</script>

文章来自 www.96net.com.cn