v-bind的使用

v-bind的使用

语法模板
v-bind：属性名 = 表达式（可以是变量和常量）
(通过绑定属性,表达式可以是变量名,通过vue实例中变量名,来更换标签的属性值)

<div id="app">
	<img v-bind:src ="herf">
</div>
<script>
	vue app = new Vue();
	el:"#app"
	data:{
		isActive:false;
		href:http://baidu.com/
	}
</script>

v-bind指令可以用过绑定属性来更改显示的数据。
v-bind就是用于绑定数据和元素属性的

v-bind也可以通过vue实例中的数据的值（false和true）来控制是否将属性加到标签中。
（这个用法可以通过三元表达式或者通过对象）
(是否可以拓展为其他属性也可以这么用?)

<div id="app">
	<img v-bind:class = "isAcitive？ active:"" ">
	//表示isActive true，那么添加一个active的类到img中.(通过三元表达式用法)

	<img v-bind:class = "{isActive:active} ">
	表示isActive为true，那么添加一个active的类到img中
</div>

<script>
	vue app = new Vue();
	el:"#app"
	data:{
		isActive:false;
		href:http://baidu.com/
	}
</script>