Sarah cartenz
Sarah cartenz

Reputation: 1313

FlatList does not render (it does not display on screen)

I have a component that gets some data from firebase, stores it in an array "CompanyOffers" and should display it via a FlatList. The FlatList, along with other components are inside of a ScrollView. Everything above the FlatList is rendered and displays on the screen except for the FlatList itself. Whats going wrong ??

class CompanyDetails extends Component {
  constructor(props) {
    super(props);
    ...
    this.state = {
        loading: true,
        CompanyOffers: [],
    };
  }

...

  render() {
    return (
      <ScrollView>
          <View>
            <View>
              <View>
                <Image
                  source={{ uri: this.props.logo }}
                />
              </View>
              <View>
                <Text>{this.props.companyName}</Text>
                <Text>{this.props.description}</Text>
              </View>
            </View>
          </View>

          <FlatList
            data={this.state.CompanyDetails}
            renderItem={({ item }) => <Text>hello</Text> }
          />

      </ScrollView>
    );
  }
}

export default CompanyDetails;

Note: I have styles for the components but removed them for the question.

Upvotes: 0

Views: 290

Answers (1)

yogesh agrawal
yogesh agrawal

Reputation: 726

I guess your array is CompanyOffers check once

    <FlatList
            data={this.state.CompanyOffers}
            renderItem={({ item }) => <Text>hello</Text> }
   />

Upvotes: 1

Related Questions