init

components/mySwiper.vue

@@ -0,0 +1,97 @@
+<script setup>
+	// 引入依赖
+	import {watch,ref,reactive} from "vue"
+	// props
+	const props = defineProps(['lbt_list',"height","isRadius","indicatorDots"])
+	// 变量
+	const interval = ref(2000)
+	const autoplay = ref(true)
+	// const indicatorDots = ref(false)
+	// 监听
+	watch(()=> {
+		return props.lbt_list
+	},(val1,val2) => {
+		// console.log(val1)
+		
+	})
+	// 方法
+	function intervalChange(e) {
+		interval.value = e.target.value
+	}
+	function lbtFunc(item) {
+		// 新版数据结构的跳转形式
+		uni.navigateTo({
+			url:item.url
+		});
+		return
+		
+		// 旧版数据结构的跳转形式
+		// if(item.skip_url_type == 2) { // 内链
+		// 	uni.navigateTo({
+		// 		url:item.skip_url
+		// 	});
+		// }
+		// else{ // 外链
+		// 	uni.navigateTo({
+		// 		url:`/pages/webview/webview?links=${item.skip_url}&name=${item.name}`
+		// 	});
+		// }
+		
+	}
+</script>
+<template>
+	<view class="swiper-box">
+		<view class="uni-margin-wrap">
+			<swiper class="swiper" :class="{radiuscss:isRadius}" :style="'height: '+height*2+'rpx;'" circular :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval"
+				:duration="duration">
+				<swiper-item @click="lbtFunc(item)" v-for="(item,i) in lbt_list">
+					<view class="swiper-item uni-bg-red">
+						<!-- <img style="width: 100%;" :src="item.url" alt=""> -->
+						<image :src="item.image" style="width: 100%;" mode="widthFix"></image>
+					</view>
+				</swiper-item>
+			</swiper>
+		</view>
+	</view>
+</template>
+<style>
+	.radiuscss{
+		border-radius:30rpx;
+		overflow: hidden;
+	}
+	.swiper-box{
+		
+	}
+	.swiper-item>img{
+		width: 100%;
+	}
+	.uni-margin-wrap {
+		width: 690rpx;
+		width: 100%;
+	}
+	.swiper {
+		height: 300rpx;
+	}
+	.swiper-item {
+		display: block;
+		height: 300rpx;
+		line-height: 300rpx;
+		text-align: center;
+	}
+	.swiper-list {
+		margin-top: 40rpx;
+		margin-bottom: 0;
+	}
+	.uni-common-mt {
+		margin-top: 60rpx;
+		position: relative;
+	}
+	.info {
+		position: absolute;
+		right: 20rpx;
+	}
+	.uni-padding-wrap {
+		width: 550rpx;
+		padding: 0 100rpx;
+	}
+</style>