vue学习笔记7-属性绑定-v-bind

一个a标签可以通过设置href属性来确定要跳转的位置,例如:

<a href="http://baidu.com">哈哈</a>

但这个href属性就被写死了,可变性就比较弱了 可以使用v-bind:,这个:后面才是想要的属性

<a v-bind:href="url">哈哈</a>
data : {
    url:"http://baidu.com"
};

效果相同。 不止是href,所有的属性都可以绑定

<div id="app">
    <a v-bind:href="url">哈哈</a>
    <img v-bind:src="img"/>
</div>
var data = {
    url:"http://baidu.com",
    img:"https://www.baidu.com/img/bd_logo1.png",
};

所以class什么的也可以进行绑定的。 但通常我们不会这么写,因为比较常用所以说vue提供了简略写法,直接写一个:即可。

<div id="app">
    <a :href="url">哈哈</a>
    <img :src="img"/>    
</div>

效果相同。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

扫码关注云+社区

领取腾讯云代金券