为了账号安全,请及时绑定邮箱和手机立即绑定
关注
Bestdoing

如果每个 <li> 下面都有个<a href="不同的链接地址">, 这个应该怎么循环出来

如果每个 <li> 下面都有个<a href="不同的链接地址">, 这个应该怎么循环出来;怎么循环出 href=""

2018-05-30 源自:vue2.5入门 2-6 1139 浏览 4 回答

最佳回答

2018-05-30

<ul id="aaa">

    <li v-for='(item,index) in items' :key=index><a :href='item.href'>{{item.name}}</a></li>

  </ul>

  


    let a = new Vue({

      el: "#aaa",

      data:{

        items: [

          {

            href: 'http://www.baidu.com',

            name: 'baidu'

          },

          {

            href: 'http://www.taobao.com',

            name: 'taobao'

          }

        ]

      }

    })



贾骨文

a 的 href 为什么要写成 <a :href=""> ,而不是 <a href="">

#1 2018-07-18 回复

慕侠6209334 回复 贾骨文

因为是data的属性,需要使用v-bind绑定到a标签的href属性上,即v-bind:href="",简写为:href,这样href的值才能被解析为一个url地址。如果不绑定,href的值就会被当做字符串解析出来,而不是一个url地址。

#2 2018-08-16 回复
<ul>
  <li v-for="(list,index) of lists" :key="index"><a  :href="list.href">{{list.text}}</a></li>
</ul>
lists:[
  {text:'vue-router',href:'http://router.vuejs.org'},
  {text:'vuex',href:'http://vuex.vuejs.org'},
  {text:'vue-loader',href:'http://vue-loader.vuejs.org/'},
  {text:'awesome-vue',href:'https://github.com/vuejs/awesome-vue'},
],


2018-05-30
回复 0

为什么我的需要index与item调位?(っ °Д °;)っ

2018-06-30
回复 0

https://img2.mukewang.com/5b880f6600017acd05770191.jpg照着玩了下,点开链接,控制台还有这种东西23333

2018-08-30
回复 0

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信