- 用v-bind:给元素绑定属性,可以使属性值为变量
标准写法: v-bind:属性="变量"
data的属性可以直接使用,如果时data属性里的值就需要用对象取值
<style>
.div1{
width: 100px;
height: 100px;
border-radius: 10px;
background-color: #ccc;
}
img{
width: 50px;
height: 50px;
border-radius: 50%;
}
</style>
<body>
<div id="app">
<div class="box1">{{usermsg.name}}</div>
<div v-bind:class="box1">{{usermsg.name}}</div>
<img v-bind:src="usermsg.touxiang" alt="">
<input type="text" :value="usermsg.rename">
<div></div>
<div></div>
</div>
<script>
var vm=new Vue({
el:"#app",
data:{
box1:"div1",
usermsg:{
name:"xiumin",
rename:"baozi",
touxiang:"./1.jpg"
}
}
})
</script>
</body>
