vue实现用v-bind给src和href赋值
短信预约 -IT技能 免费直播动态提醒
v-bind给class="lazy" data-src和href赋值
用v-bind给class="lazy" data-src和href赋值其实很简单，即 v-bind:属性名="name"，其中name就是data里json数据的键值，其简写形式为 :属性名="name"。
示例
<div id="app">
<a v-bind:href="link" rel="external nofollow" >link</a>
<hr>
<a v-bind:href="link1" rel="external nofollow" >link1</a>
<hr>
<a v-bind:href="link2" rel="external nofollow" >link2</a>
<hr>
<a href="linkyou.html" rel="external nofollow" >啦啦啦</a>
<hr>
<img :class="lazy" data-src="img" alt="">
</div>
<script class="lazy" data-src="vue.js"></script>
<script class="lazy" data-src="base.js"></script>var ve2 = new Vue({
el: '#app',
data: {
link: "linkyou.html",
link1: "https//www.baidu.com",
link2: "www.baidu.com",
img: '8.jpg'
}
})
v-bind:class="lazy" data-src无效问题
vue中v-bind:class="lazy" data-src，图片无法正常显示
自己没事敲点代码，准备激发激发灵感，做一个好项目，顺便复习下vue, 发现当我在data中模拟json数据的时候，图片链接在页面上无法正常显示
用了各种方法，都无法正常使用，最后上网才发现是需要引入的问题。
附上代码
// template
<img :class="lazy" data-src="imgLink" alt="">
// script
data () {
return {
// 注：引入之后，相对路径及绝对路径均可以使用
imgLink: require("../../assets/img/home/recommend_bg.jpg")
}
},以上为个人经验，希望能给大家一个参考，也希望大家多多支持编程网。
免责声明：
① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的，并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据，供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。
② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
