vue标签属性数据绑定和拼接的实现⽅法
在vue官⽹把⽂档扫了⼀遍后，就开始写⽹站项⽬了，没有设计，就百度⾥了⼀个h5的助赢软件的⽹站把他copy下来，想想有点坏了，接着把内容改改吧。
⾸先开始做⼀个列表展⽰
vue实例好后，给对象添加默认数据，列表加载成功。查看源代码，看看是否和⼼⽬中想的⼀样。当前还只是把初始化的默认数组展⽰出来，列表⾥⾯的操作，跳转还没有加，试着给初始化的数组添加id字段和数字
刷新⼀下，没有效果，坑⼈的Chrome，缓存特别严重，不得不清缓存或者强制刷新。vue在控制台出错了，说a标签内容（<a href="xxx/detail/{{id}}" rel="external nofollow" >⽂章1</a>）的{{id}}语法错误，查了下⽂档并没有⼀个类似的例⼦，我就开始凭⾃⼰的经验试着改写下
整了好⼀会，发现不理想，看来⽂档读的不够仔细，有必要针对性的的捣⼀下。看到标签的class与syle绑定，看到有对象语法和数组语法，⼆话不说，先把对象写法写进去a标签，刷新看效果，发现a标签的href是这样detail/[object object]，我笑了。
看来还是⽤错了，看了数组语法描述后，直接coding，<a v-bind:href="['xxx/detail/'+item.Id]" rel="extern
al nofollow"
rel="external nofollow" >⽂章1</a> 这下出效果了
为什么叫数组语法，⼀直不明⽩了。为什么这个地⽅只能这样写，总感觉不妥，个类似的安全看看，别⼈是怎么写的，发现⾃⼰写的太吐⾎了
先上部分代码
<tr v-for="item in Strategys" class="ng-scope">
<td>
  <a class="ng-binding ng-scope" v-bind:href="['xxx/detail/'+item.Id]" rel="external nofollow" rel="external nofollow" >{{item.Name}}</a>
</td>
数据块代码
var vm = new Vue({
  el: '#section-strategies',
  data: {href标签怎么用
      parentMessage: 'Parent',
      StrategyCnt:0,
      Strategys: [{id:1,name:'⽂章1'}，{id:2,name:'⽂章2'}]
  }
})
接着上⼤招，使⽤Ajax请求服务端数据，不可能⼀直⽤初始化及默认的数据
以上就是本⽂的全部内容，希望对⼤家的学习有所帮助，也希望⼤家多多⽀持。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。