Vue_v-bind:.day2

YiField

于 2019-03-26 23:19:42 发布

阅读量119

点赞数

分类专栏： Vue

本文链接：https://blog.csdn.net/qq_38932407/article/details/88833176

版权

Vue 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

<div id="app">
		<a v-bind:href="url">链接</a>
		<img v-bind:src="imgUrl" height="40px">
		<!-- 缩写 -->
		<a :href="url">链接</a>
		<img :src="imgUrl" height="40px">
		<!-- 动态切换class ,isActive为true则添加该类-->
		<div :class="{'active':isActive}"></div>
		<!-- :class可以跟普通class共存 -->
		<div class="static" :class="{'active':isActive,'error':isError}"></div>
		<!-- 当条件多余两个时，可使用data或者computed -->
		
</div>

<script type="text/javascript">
	new Vue({
		el:'#app',
		data:{
			url:'http://www.baidu.com',
			imgUrl:'E:\\Web\\Vue\\s2.jpg',
			isActive:true,
			isError:false
		}



	})

</script>

运行结果：