FlatList выполняет рендеринг на iOS, но не на Android после извлечения данных через fetchAPI - PullRequest
0 голосов
/ 08 июня 2018

Я использую реагирование на нативном языке и пытаюсь отобразить простой плоский список на основе данных, которые я выбрал, используя API выборки.

Ниже приведен код -

class CategoryList extends React.Component 
{
    constructor(props) 
    {
        super(props);
        var context = this;

        this.state = {
            categories: []
        }
    }

    componentDidMount()
    {
        fetch(api_config.url + api_config.routes.all_top_level_categories)
        .then(response => response.json())
        .then(data => this.setState({ categories: data}))
        .catch(e => console.log(e));
    }

    renderFlatListItem(data)
    {
        return(<View style={styles.item}>
            <Text>{data.item.name}</Text>
          </View>);
    }

    renderItemSeparator()
    {
        return(
            <View
                contentContainerStyle={styles.itemSeparator} />
        );
    }

    render() {
        return (
                <FlatList contentContainerStyle={styles.list}
                    data={this.state.categories}
                    renderItem={(data) => this.renderFlatListItem(data)}
                    ItemSeparatorComponent={this.renderItemSeparator}
                    keyExtractor={data => data.name}
                />
        );
    }
  }

export default class HomeScreen extends React.Component
{
    static navigationOptions = ({ navigation }) => {
      return {
        title: 'Home',
      }
    };
    render() {
      return (
        <CategoryList />
      );
    }  
}

Ниже приведено изображение для Android -

enter image description here

Ниже приведеноИзображение для iOS -

enter image description here

Любая помощь по этой теме будет принята с благодарностью.Спасибо.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...