Home > Enterprise >  Why will my carousel not render? React-native-snap-carousel
Why will my carousel not render? React-native-snap-carousel

Time:03-04

I am using react-native-snap-carousel and I thought what I have now would be enough to implement it but I am obviously missing something. I have posted a snack expo here reproducing exactly what I am attempting as well as some code below.

Thank you for any insight at all, I appreciate it more than you know.

export default class App extends React.Component {
  state = {
  coordinates: [
      {name: 'TappRoom', },
      {name: 'The Ale House', },
      {name: 'Boone Saloon',},
      {name: 'Ransom',},
    ],
}


renderCarouselItem = ({item}) => {
    <View style={styles.cardContainer}>
      <Text style={styles.name}>{item.name}</Text>
    </View>
  }

  render(){
  return (
    <View style={styles.container}>
      <Carousel
              ref={(c) => { this._carousel = c; }}
              data={this.state.coordinates}
              renderItem={this.renderCarouselItem}
              sliderWidth={Dimensions.get('window').width}
              itemWidth={300}
              removeClippedSubviews={false}
        />
    </View>
  );
}
}

CodePudding user response:

You missed return. Change your code to this

renderCarouselItem = ({item}) => {
    return <View style={styles.cardContainer}>
      <Text style={styles.name}>{item.name}</Text>
    </View>
  }
  • Related