我是谁666

发布：2023-11-28 15:42
更新：2023-11-28 17:35
阅读：174

【报Bug】swiper 在app 切换时,希望 0-2 是右滑的动画。2-0是左滑的动画, 现在是会反过来。没法进行无缝衔接

分类：uni-app

bug反馈

产品分类： uniapp/App

PC开发环境操作系统： Mac

PC开发环境操作系统版本号： macOS 12.6.3

HBuilderX类型：正式

HBuilderX版本号： 3.98

手机系统： Android

手机系统版本号： Android 13

手机厂商：华为

手机机型： nova 10

页面类型： vue

vue版本： vue2

打包方式：云端

项目创建方式： HBuilderX

操作步骤：

swiper 修改当前下标,当到2变0时,然后是无缝衔接的

预期结果：

希望 0-2 是右滑的动画。2-0是左滑的动画, 现在是会反过来。没法进行无缝衔接

实际结果：

0-2 是左滑的动画,2-0是右滑的动画,

bug描述：

swiper 在app 切换时,希望 0-2 是右滑的动画。2-0是左滑的动画, 现在是会反过来。没法进行无缝衔接

2023-11-28 15:42 负责人:无分享

4 个回复

爱豆豆 - 办法总比困难多

因为你开了无缝衔接肯定是向最近的方向滚动的。如果你不想要这种效果的话可以使用动态circular控制滚动方向
参考代码片段

<template>  
    <view>  
        <swiper :current="current" :indicator-dots="true" :circular="circular" @animationfinish="animationfinish">  
            <swiper-item>  
                <view class="swiper-item">0</view>  
            </swiper-item>  
            <swiper-item>  
                <view class="swiper-item">1</view>  
            </swiper-item>  
            <swiper-item>  
                <view class="swiper-item">2</view>  
            </swiper-item>  
        </swiper>  
        <button @click="setCurrent">current---{{current}}</button>  
    </view>  
</template>  

<script>  
    export default {  
        data() {  
            return {  
                current:0,  
                circular:true  
            }  
        },  
        methods: {  
            setCurrent() {  
                this.circular = false  
                this.$nextTick(() => {  
                    this.current = this.current == 0 ? 2 : 0  
                })  
            },  
            animationfinish() {  
                this.circular = true  
            }  
        }  
    }  
</script>  

<style scoped>  
.swiper-item {  
    width: 100%;  
    height: 300rpx;  
    background-color: pink;  
}  
</style>

我是谁666 (作者) - 我是谁

如果开启自动轮播,那是可以同一个方向,但是问题了 2-1、1-0、0-2 就没法实现了

我是谁666 (作者) - 我是谁

所以我希望官方可以给一个方案,或者修改下,0-1、1-2、2-0 滑动方向是一样的

我是谁666 (作者) - 我是谁

我就是要向最近的方向滚动,h5是没问题,app nvue 就是有问题, app vue 我没有试, app nvue比如我0-1、1-2、2-0我希望是同一个方向,但是0-1和1-2是同一个方向,2-0和前面两个是反方向

爱豆豆

你上面页面类型标示是 vue类型页面所以我用的是vue

我刚试了nvue确实是你所描述的效果

2023-11-28 17:57
爱豆豆

可以去插件市场找一个轮播图插件修改一下应该能做到你说的效果

2023-11-28 17:58
我是谁666 (作者)

回复爱豆豆: 就是希望官方能修复这个bug,因为很多地方用到 swiper 切换一屏一屏的

2023-11-28 18:18

要回复问题请先登录或注册

【报Bug】swiper 在app 切换时,希望 0-2 是右滑的动画。2-0是左滑的动画, 现在是会反过来。没法进行无缝衔接

操作步骤：

swiper 修改当前下标,当到2变0时,然后是无缝衔接的

预期结果：

希望 0-2 是右滑的动画。2-0是左滑的动画, 现在是会反过来。没法进行无缝衔接

实际结果：

0-2 是左滑的动画,2-0是右滑的动画,

bug描述：

4 个回复

公告

相关问题

【报Bug】swiper 在app 切换时,希望 0-2 是右滑的动画。2-0是左滑的动画, 现在是会反过来。没法进行无缝衔接

操作步骤： swiper 修改当前下标,当到2变0时,然后是无缝衔接的

预期结果： 希望 0-2 是右滑的动画。2-0是左滑的动画, 现在是会反过来。没法进行无缝衔接

实际结果： 0-2 是左滑的动画,2-0是右滑的动画,

bug描述：

与内容相关的链接

4 个回复

公告

相关问题

操作步骤：

swiper 修改当前下标,当到2变0时,然后是无缝衔接的

预期结果：

希望 0-2 是右滑的动画。2-0是左滑的动画, 现在是会反过来。没法进行无缝衔接

实际结果：

0-2 是左滑的动画,2-0是右滑的动画,