P7属性绑定
- 2023-07-27 11:00:14
- 微图
- 442
- 最后编辑:微图 于 2024-03-26 14:26:39
- 分享链接
打开终端
删地只剩script和template
不用输入尖括号,直接输标签,弹出待选标签
v-bind:class="msg"
<template>
<div v-bind:class="msg">测试</div>
</template>
<script>
export default {
data() {
return{
msg:"active"
}
}
}
</script>
加id
<template>
<div v-bind:id="dynamicId" v-bind:class="msg">测试</div>
</template>
<script>
export default {
data() {
return{
msg:"active",
dynamicId:"appID"
}
}
}
</script>
简写:
1次绑定多属性
objectofAttrs: {
class:"1次绑定多appclss",
id:"1次邦多appid"
}
<template>
<div v-bind:id="dynamicId" v-bind:class="msg">测试</div>
<div v-bind="objectofAttrs">测试</div>
</template>
<script>
export default {
data() {
return{
msg:"active",
dynamicId:"appID",
objectofAttrs: {
class:"1次绑定多appclss",
id:"1次邦多appid"
}
}
}
}
</script>
按钮是否可用
isButtonDisable:true
<template>
<div v-bind:id="dynamicId" v-bind:class="msg">测试</div>
<div v-bind="objectofAttrs">测试</div>
<button :disabled="isButtonDisable">按钮可用?</button>
</template>
<script>
export default {
data() {
return{
msg:"active",
dynamicId:"appID",
objectofAttrs: {
class:"1次绑定多appclss",
id:"1次邦多appid"
},
isButtonDisable:true
}
}
}
</script>
发表评论