<template>
	<view class="" style="position: relative;">
		<scroll-view scroll-x="true" class="page-top" :scroll-left="scrollleft" @scroll="scroll" :lower-threshold="right" @scrolltolower="lower">
			<view class="page-top-one" v-for="(item,index) in list" :key="index" >
				<view class="one-list" :class="item.isIndex == 5?'isokid':''" :id="item.isIndex == 5?'isokid':''">
					{{item.isIndex}}
				</view>
			</view>
		</scroll-view>
		<view class="page-bottom">
			<view class="page-bottom-top">
				
			</view>
		</view>
	</view>
</template>


<script>
export default {
	data() {
		return {
			list: [
				{
					isPrize: true,
					name: "520大礼包",
					isIndex: 0,
				},
				{
					isPrize: false,
					isIndex: 1,
				},
				{
					isPrize: false,
					isIndex: 2,
				},
				{
					isPrize: true,
					name: "520大礼包1",
					isIndex: 3,
				},
				{
					name: "现金礼包2",
					isPrize: true,
					isIndex: 4,
				},
				{
					isPrize: false,
					isIndex: 5,
				},
				{
					isPrize: true,
					name: "520大礼包3",
					isIndex: 6,
				},
				{
					name: "现金礼包4",
					isPrize: true,
					isIndex: 7,
				},
				{
					isPrize: false,
					isIndex: 8,
				},
				{
					isPrize: true,
					name: "520大礼包3",
					isIndex: 9,
				},
				{
					name: "现金礼包4",
					isPrize: true,
					isIndex: 10,
				},
			],
			newList: [],
			rotate: 0, // 旋转角度
			num: 0, // 第几次抽奖
			takeTime: 3, //抽奖的总次数
			disable: true, //是否能够抽
			timer: null,
			times: 0, //计时器初始值
			scrollleft:1,//滚动
			right:10,
			countdown:'',//定时器
			countdowntow:'',//定时器
			left:0,
			phonewindth:0,//屏幕宽度,
			isok:0,//第几个是选中的
			stopjuli:0,//需要停止的距离
		};
	},
	mounted() {
		clearInterval(this.countdown);
		this.countdown = null;
		this.list.forEach((item,index)=>{
			if(item.isIndex == 4){
				this.isok = index;
			}
		})
		uni.getSystemInfo({
			 success: (res) => {
				const query = uni.createSelectorQuery().in(this);
				query.select('#isokid').boundingClientRect(data => {
				  this.phonewindth = (parseInt(res.windowWidth / 2) - data.width/2);
				  console.log(this.phonewindth)
				}).exec();
			 }
		})
	},
	onUnload(){
		clearInterval(this.countdown);
		this.countdown = null;
	},
	onHide(){
		clearInterval(this.countdown);
		this.countdown = null;
	},
	onReady() {
		let observer = uni.createIntersectionObserver(this);
		console.log(observer.relativeTo('.scroll-view').observe)
		observer.relativeTo('.scroll-view').observe('.isokid', (res) => {
			console.log(res.boundingClientRect.left,this.phonewindth)
			if(res.boundingClientRect.left < this.phonewindth + 100){
				 this.closeTime(this.scrollleft);
				 return
			}
		})
	},
	methods: {
		closeTime(e){
			this.scrollleft = e;
			clearInterval(this.countdown);
			this.countdown = null;
				// 放慢
				this.countdown = setInterval(()=>{
					this.scrollleft = this.scrollleft +1;
					let observer = uni.createIntersectionObserver(this);
					observer.relativeTo('.scroll-view').observe('.isokid', (res) => {
						if(res.intersectionRect.left == this.phonewindth){
							clearInterval(this.countdown);
							this.countdown = null;
						}
					})
				},20)
		},
		// 滚动距离
		scroll(e){
				let observer = uni.createIntersectionObserver(this);
				console.log(observer.relativeTo('.scroll-view').observe)
				observer.relativeTo('.scroll-view').observe('.isokid', (res) => {
					console.log(res.boundingClientRect.left,this.phonewindth)
					if(res.boundingClientRect.left < this.phonewindth + 100){
						 this.closeTime(this.scrollleft);
						 return
					}
				})
		},
		// 数组解构
		edArray(list) {
			this.newList = list
		},
		lower(e){
			console.log(e,'到最边了')
			this.scrollleft = 0;
		},
	},
};
</script>


<style>
	scroll-view ::-webkit-scrollbar {
	  display: none;
	  width: 0 !important;
	  height: 0 !important;
	  -webkit-appearance: none;
	  background: transparent;
	}
</style>


<style scoped lang="scss">
	.page-bottom{
		width: 100%;
		height: 10rpx;
		display:flex;
		justify-content: center;
		position: absolute;
		left: 0rpx;
		bottom: 0rpx;
		.page-bottom-top{
			width: 6rpx;
			height: 30rpx;
			background-color: red;
		}
	}
.page-top{
	width: 100%;
	height: 200rpx;
	display: flex;
	align-items: center;
	border: solid 2rpx #4CD964;
	white-space: nowrap; // 滚动必须加的属性
	margin: 0 auto;
	position: relative;
}
.page-top-one{
	width: 200rpx;
	height: 200rpx;
	background:#000;
	margin-right: 20rpx;
	display: inline-block;
}
.one-list{
	width: 100%;
	height: 200rpx;
	line-height: 200rpx;
	text-align: center;
	font-size:40rpx;
	font-weight: 600;
	color: #FFFFFF;
}
</style>

返回的内容是 这样的 是什么原因啊

ƒ (e,...o){if(Gl()>n){var l=s.call(t,e,...o);return r&&x(l)&&!Ml.has(l)&&(Hl(`${u}.`,l,!1,n,i,a),Ml.add(l)),l}var c=zi(),d=Date.now(),p=Nl();try{var h=s.call(t,x(e)&&("success"in e||"fail"in e||"comple…