首页 > 其他 > 详细

一起学vue指令之v-bind

时间:2019-12-15 17:12:10      阅读:69      评论:0      收藏:0      [点我收藏+]

一起学vue指令之v-bind

网页的图片url地址并不是固定写死的,如果写死,每一个活动就改一次图片的url,一个网页有多少张图片,工作量多大?

通常来说,客户端向服务器发送请求,服务器返回url数据到vue实例的data数据中,由于url动态绑定了vue实例的data,所以会实时更新图片.无需我们手工更改,并且不会出错。

有的同学说,直接用插值语法不就行了?

插值语法【mustache】{{}}仅用于标签的内容值【即下图的<h2>标签包裹的值】,无法作用于标签属性。

技术分享图片
如果强行给属性进行插值赋值,那么属性值就是该插值的字符串

如果强行给属性进行插值赋值,那么属性值就是该插值的字符串。

技术分享图片
如果强行给属性进行插值赋值,那么属性值就是该插值的字符串。

技术分享图片
如果强行给属性进行插值赋值,那么属性值就是该插值的字符串。

此时需要v-bind指令,使用该指令后,字符串url不再是一个字符串,而是一个变量。src将获得该变量的值

技术分享图片
使用v-bind

一起学vue指令之v-bind

原文:https://www.cnblogs.com/singledogpro/p/12044532.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!