fetching data from api in react-native snap carousel but not working properly

Question

I am using your react-native Snap carousel, It works great, But I am trying to get data from API, It worked but It shows me total data in one card. How can i show it separately?

Here is the code:

List.js

mainExample () {
        const { slider1ActiveSlide } = this.state;
        return (
            <View>
                <Carousel
                    data={data}
                />
                <Pagination
                    dotsLength={length}
                />
            </View>
        );
    }

SliderEntry.js

        return (
            <TouchableOpacity
                activeOpacity={1}
                onPress={() => { alert(`You've clicked`); }}
            >
                <View>
                    {Title}
                    <Text
                    >
                        {available}
                    </Text>
                </View>
            </TouchableOpacity>
        );

It's showing all fetched data in one card. Anyone Please help me!

Answer 1

This has absolutely nothing to do with the plugin itself.

Since you're already passing responseMsg._embedded.items to the Carousel, you should just leverage the prop data of your SliderEntry component instead of referencing it again and mapping it.

const { name, available } = data;

return (
    <TouchableOpacity>
        <Text>{ name }</Text>
        <Text>{ available }</Text>
    </<TouchableOpacity>
);