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

bootstrap的轮播,vue绑定数据?

bootstrap的轮播,vue绑定数据?

Zoe_z 2018-05-28 21:41:30
一开始用bootstrap来实现静态的轮播,现在用vue来绑定之后,轮播就动不了?<div class="section" id="sj">     <div v-for="r in datas" class="section content" :id="r.autoid">         <div id="carousel-example-generic section " class="carousel slide" data-ride="carousel">              <!-- Indicators -->             <ol class="carousel-indicators">                 <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>                 <li data-target="#carousel-example-generic" data-slide-to="1"></li>                 <li data-target="#carousel-example-generic" data-slide-to="2"></li>                 <li data-target="#carousel-example-generic" data-slide-to="3"></li>             </ol>             <!-- Wrapper for slides -->             <div class="carousel-inner section" role="listbox" >                 <div class="item active"><img :src="'images/sj/'+r.photo1+'.jpg'" alt="..."></div>                 <div class="item "><img :src="'images/sj/'+r.photo2+'.jpg'" alt="..."></div>                 <div class="item "><img :src="'images/sj/'+r.photo3+'.jpg'" alt="..."></div>                 <div class="item "><img :src="'images/sj/'+r.photo4+'.jpg'" alt="..."></div>               </div>         </div>    </div></div>js:$(function(){     var vmm = new Vue({         el:"#sj",         data:{         datas:[]         },         mounted:function(){         this.showData();         this.showCar();         },         methods:{         showData:function(){         $.ajax({             type:'get',             url:'../wxk.json',             dataType:'json',             success:function(data){             for(var i=0;i<data.sjList.length;i++){                 if(sjid == data.sjList[i].autoid){                      vmm.datas.push(data.sjList[i]);                 }             }             }           });         },         showCar:function(){         //轮播         $(".carousel").swipe({         swipeLeft: function() { $(this).carousel('next'); },         swipeRight: function() { $(this).carousel('prev'); },         });         }     } });
查看完整描述

1 回答

  • 1 回答
  • 0 关注
  • 2442 浏览
慕课专栏
更多

添加回答

举报

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