23:51:57.142 Error: Not Found:Page[1][-1,2] at view.umd.min.js:1
23:51:57.187 Error: Not Found:Page[1][-1,2] at view.umd.min.js:1
23:51:57.209 cid unmatched [object Object] at view.umd.min.js:1
23:51:57.230 TypeError: Invalid attempt to destructure non-iterable instance.
23:51:57.251 In order to be iterable, non-array objects must have a [Symbol.iterator]() method. at view.umd.min.js:1
组件
<template name="swiper-bar">
<view class="my-plan-style">
<!-- 3D轮播 -->
<view class="out">
<swiper class="imageContainer" @change="handleChange" previous-margin="20rpx" next-margin="20rpx" circular autoplay>
<block v-for="(item,index) in imgList" :key="index" >
<swiper-item class="swiperitem">
<image class="itemImg" @click="jumpPge(item)" :class="currentIndex == index ? 'swiperactive': ''" :src="item.icon" lazy-load mode="scaleToFill"></image>
</swiper-item>
</block>
</swiper>
<view class="pointbox" v-if="isPoint">
<block v-for="(item,index) in imgList" :key="index">
<view class="point" :class="currentIndex == index ? 'pointactive': ''"></view>
</block>
</view>
</view>
</view>
</template>
<script>
export default {
name: 'swiper-bar',
props: {
/**
* 固定到页面顶部
*/
imgList: {
type: Array,
default: ()=>[]
},
isPoint: {
type: Boolean,
default: false
},
},
data() {
return {
currentIndex:0
};
},
computed: {
},
created() {
console.log(this.imgList);
},
methods: {
handleChange(e){
this.currentIndex = e.detail.current;
},
jumpPge(item){
this.$emit('clickSwiper',item)
}
}
}
</script>
引入
mport swiperBar from "@/components/jing-swiper/jing-swiper.vue"
components:{swiperBar},
使用
<view class="contetn" >
<view class="yellow_local">
<view class="swiper">
<swiper-bar :imgList="swiperList" @clickSwiper="goTetial" :isPoint="true"></swiper-bar>
</view>
</view>
</view>
0 个回复