About the showLength and loop problem

[adwqqf]

When I setting the showLength number equal to data length, the view of first card will disappear in mode "horizontal-stack" or "vertical-stack". The problem just happen in loop = true , showLength number and data length greater than or equal to 3. Example code:

const data = [{ id: '1' }, { id: '2' }, { id: '3' }];

 <Carousel
          data={data}
          width={500}
          height={400}
          loop={true}
          mode="horizontal-stack"
          modeConfig={{
            showLength: 3,
            scaleInterval: 0.2,
            stackInterval: 50,
            opacityInterval: 0.2,
          }}
          renderItem={({ item }) => (
            <View
              style={{
                borderWidth: 1,
                width: 300,
                height: 200,
              }}
            >
              <Text>{item.id}</Text>
            </View>
          )}
        />

Is it possible that I can show 3 card when I get 3 object in looping?

[adwqqf]

any update?

[alemarra89]

Hi everyone, the problem stil seems to be present.
@adwqqf did you solve it?
@dohooo any news?
thanks

[vishal30982]

having Warning: TypeError: Cannot set property 'showLength' of undefined

[dosubot]

Hi, @adwqqf. I'm Dosu, and I'm helping the react-native-reanimated-carousel team manage their backlog. I'm marking this issue as stale.

Issue Summary:

• The issue involves the carousel's "horizontal-stack" or "vertical-stack" mode.
• The first card disappears when loop is true, and showLength equals the data length (3 or more).
• @alemarra89 asked for updates or solutions, and @vishal30982 reported a related warning error.
• The issue remains unresolved, with users seeking further assistance.

Next Steps:

• Please let me know if this issue is still relevant to the latest version of the react-native-reanimated-carousel.
• If there is no further activity, the issue will be automatically closed in 7 days.

Thank you for your understanding and contribution!

[adwqqf]

For my 2022 solution, just duplicate the data.

const data = [{ id: '1' }, { id: '2' }, { id: '3' },{ id: '1' }, { id: '2' }, { id: '3' }];