vue.js 绑定到html中,如何在Vuejs中绑定HTML属性?

在本篇文章中,我们将学习如何在vuejs中绑定HTML属性。

这是我们的起始代码。

Binding atrributes in {{title}}

在上面的代码中,我们需要绑定src属性的数据来显示图像。

在data里面我们有image:"logo.png"属性,现在我们需要将src属性链接到image属性,以便我们可以显示图像。

问题是花括号{{}}语法无法绑定html属性中的数据。%7B%7Bimage%7D%7D //wrong: doesn't display any image

为了绑定HTML属性中的数据,Vuejs为我们提供了一个指令v-bind:atrributename。 // 用户现在可以看到图像

这里v-bind指令将元素的src属性绑定到表达式image的值。

如果我们使用v-bind指令,我们可以评估引号内的JavaScript表达式v-bind:src="js expression"。

v-bind:attributename还可以编写简写语法:attributename。

同样,我们可以将此语法与其他HTML属性一起使用。ClickMy link

本篇文章就是关于在Vuejs中绑定HTML属性的方法介绍,希望对需要的朋友有所帮助!

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值