vue轮播图 实现
<div class="layui-container" id="app">
<div class="layui-row">
<div class="layui-col-md7" >
<div v-for="(item,index) in arr ">
<img :src="item.pic" v-if="index==current">
</div>
</div>
</div>
<script>
new Vue({
el: '#app',
data () {
return {
arr:null,
current:0
}
},
mounted() {
axios
.get('http://**********ble')
.then(response=>(
this.arr = response.data.msg
))
.catch(function (error) {
console.log(error)
})
this.autoplay()
},
methods:{
autoplay:function () {
let that = this
setInterval(function () {
that.current ++
if (that.current ==that.arr.length){
that.current =0
}
},2000)
},
}
})
</script>
|