v-bind 设置元素得属性v-bind指令的作用是：为元素绑定属性完整写法是v-bind：属性名简写的话可以直接省略

v-bind指令的作用是：为元素绑定属性

完整写法是 v-bind：属性名

简写的话可以直接省略 v-bind，只保留：属性名

需要动态的增删 class 建议使用对象的方式

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>v-bind指令</title>
		<style>
			.active{
				border: 0.0625rem solid green;
			}
		</style>
	</head>
	<body>
		<div id="app">
			<img :src="imgSrc" :title="imgTitle+'!'"
			:class="{active:isActive}" @click="changeisActive"/>
		</div>
		<!-- 开发环境版本，包含了有帮助的命令行警告 -->
		<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
		<script>
			var app = new Vue({
				el:"#app",
				data:{
					imgSrc:"https://i03piccdn.sogoucdn.com/4b32a8f327e61d22",
					imgTitle:"可爱的小狗",
					isActive:false
				},
				methods:{
					changeisActive:function(){
						this.isActive = !this.isActive;
					}
				}
			})
		</script>
	</body>
</html>