<template>
	<sliderSwitch @change="swiperChange" :autoplay="true" ref='banner' :list="list" :config={imageMode} class="banner">
		<template v-slot="{item,config}">
			<bannerItem @load="load" :imageMode="config.imageMode" :item="item"></bannerItem>
		</template>
	</sliderSwitch>
</template>

<script>
	import bannerItem from './banner-item.vue'

	export default {
		components: {
			bannerItem
		},
		props: ['list', 'imageMode'],
		data() {
			return {}
		},
		methods: {
			load() {
				this.boundingClientRect()
			},
			swiperChange(e) {
				this.$emit('change', e)
			},
			boundingClientRect() {
				this.$refs.banner.boundingClientRect()
			}
		}
	}
</script>

<style lang="scss" scoped>
</style>
