uniapp scroll-view 点击左右方向按键自动滚动到设置位置

uniapp scroll-view 点击左右方向按键自动滚动到设置位置_第1张图片


    //左按钮
		<image  src="" @click="slideLeft">
		image>


		<scroll-view class="uni-swiper-tab" scroll-x ref="scrollView"  :scroll-left="scrollLeft">
			
			<view class="scrollx_items" v-for="(img,index) in scrollimg" :key="index" :class="scrollxIndex==index?'':'mengbu'" @click="previewImgClick(index)">

				<image style="z-index:-1;" class="scrollx_items_img" :src="img"   :class="scrollxIndex==index?'jinbian':''">image>

			view>
			
		scroll-view>
		
    //右按钮
		<image  @click="slideRight">
		image>
		
			slideLeft(event) {
				this.scrollLeft = event.detail.x-100; 
				

			},
			slideRight(event) {
				this.scrollLeft = event.detail.x+ 100; // 获取点击位置的x坐标
		
				// setTimeout(() => {
				// 	this.$refs.scrollView.scrollLeft= this.targetX ; // 根据点击位置计算滚动目标位置
				// }, 300); // 设定滚动动画持续时间(单位ms)
			}

你可能感兴趣的:(uni-app)