เมื่อผู้ใช้จะคลิกที่ปุ่มลูกศรย้อนกลับ ตัวบ่งชี้แถบความคืบหน้าจะไม่ลดลงในการตอบสนองแบบเนทีฟ

ฉันต้องการบรรลุฟังก์ชันนี้ เมื่อผู้ใช้คลิกปุ่มลูกศรย้อนกลับ ตัวบ่งชี้แถบความคืบหน้าจะลดลง และจะแสดงคำถามก่อนหน้าในแบบหมุน

ฉันกำลังใช้ 'react-native-snap-carousel' เพื่อแสดงข้อมูลของคำถามและคำตอบ และ 'react-native-progress-bar-animated' สำหรับตัวบ่งชี้แถบความคืบหน้าในการแสดงผลใน react-native

โปรดช่วยฉันด้วยว่าฉันจะบรรลุฟังก์ชันนี้ได้อย่างไร ฉันยังใหม่ในเรื่อง react-native ขอบคุณในขั้นสูง

นี่คือโค้ดบางส่วนเพื่อให้เข้าใจง่าย

 onSnapToItem = (index) => {
            console.log("get indexvalue", index);

            if (index > 0) {

                let progress = this.state.progress + 100 / this.state.questionList.length
                console.log("my progress qsn length", progress, this.state.questionList.length)
                this.setState({ indexvalue: index, progress: progress }, () => {
                    console.log("check progresss index", this.state.progress, index);
                })
            }

        }

        increase = (value) => {
            this.setState({
                [value]: this.state[value] + value,
            });
             this.carousel._snapToItem(this.state.indexvalue + 1)

        }
        decrease = (value) => {
            this.setState({
                [value]: this.state[value] + value,
            });
            this.carousel._snapToItem(this.state.indexvalue - 1)

        }


     <View style={styles.container}>
                    <View style={styles.topView}>
                        <TouchableOpacity onPress={() => { this.decrease(this.state.progress) }}>
                            <Image source={require('./../../Images/left-arrow-red.png')} style={styles.topImage} />
                        </TouchableOpacity>
                        <TouchableHighlight style={{ marginTop: hp('1.5%') }}>
                            <ProgressBarAnimated
                                width={wp('70%')}
                                value={this.state.progress}
                                // maxValue={100}
                                onComplete={() => {
                                    this.props.navigation.navigate('EditprofileScreen')
                                }}
                                height={hp('0.6%')}

                            />
                        </TouchableHighlight>

                        <TouchableOpacity onPress={() => { this.props.navigation.goBack() }}>
                            <Image source={require('./../../Images/closescreen.png')} style={styles.topImage1} />
                        </TouchableOpacity>
                    </View>

                    <Carousel
                        data={questionList}
                        renderItem={this.renderItemQuestion}
                        itemWidth={wp('100%')}
                        sliderWidth={wp('100%')}
                        ref={ref => this.carousel = ref}
                        scrollEnabled={false}
                        onSnapToItem={this.onSnapToItem}
                        extraData={this.state.indexvalue}

                    />

                    <TouchableOpacity onPress={() => this.increase(this.state.progress)}><Text style={styles.skiptext}>Skip</Text></TouchableOpacity>
                </View>