zhdt-miniapp/colorui/screenTextScroll.vue

<template>
	<view class="_notice">
		<swiper class="_swiper tc" @change="slideChange" indicator-dots="false" autoplay="true" circular="true"
		 display-multiple-items="2" :duration="duration" :interval="interval">
			<swiper-item>
				<view class="swiper-item uni-bg-red"></view>
			</swiper-item>
			<swiper-item>
				<view class="swiper-item uni-bg-red"></view>
			</swiper-item>
			<swiper-item v-for="(item,index) in list" :key="index">
				<view class="swiper-item uni-bg-red">{{item}}</view>
			</swiper-item>
		</swiper>
	</view>
</template>

<script>
	export default {
		props: {
			//显示数据
			list: {
				type: Array,
				defual:function(){
					return [];
				}
			},
		},
		data() {
			return {
				interval:3000,
				duration:12000,
			};
		},
		methods:{
			slideChange(e){
				this.$emit('getCurrentIndex',e.detail.current); 
				
			}
		}
	};
</script>

<style>
	._notice {
		width: 100%;
		font-size: 25rpx;
		color: #ffffff;
		border-radius: 6rpx;
		overflow: hidden;
		box-sizing: border-box;
		height: 45upx;
		
	}
	._swiper {
		line-height: 47upx;
	}
</style>