Реагирует ли родной вид без прокрутки без ScrollView - PullRequest
0 голосов
/ 04 сентября 2018

Это ссылка на учебник (https://medium.com/react-native-development/how-to-use-the-flatlist-component-react-native-basics-92c482816fe6), с которой я изучаю реакцию на язык). Все работает нормально, кроме просмотра не прокручивается

 import React, { Component } from 'react';
 import { FlatList, Text, View } from 'react-native';
 import { List, ListItem } from "react-native-elements";

 type Props = {}
 export default class FlatListDemo extends Component<Props> {
  constructor(props) {
    super(props);
    this.state = {
        loading: false,
        data: [],
        page: 1,
        seed: 1,
        error: null,
        refreshing: false,
    };
}

componentDidMount() {
    this.makeRemoteRequest();
}

makeRemoteRequest = () => {
    const { page, seed } = this.state;
    const url = `https://randomuser.me/api/?seed=${seed}&page=${page}&results=20`;
    this.setState({
        loading: true
    });

    fetch(url)
        .then(res => res.json())
        .then(res => {
            this.setState({
                data: page === 1 ? res.results : [...this.state.data, ...res.results],
                error: res.error || null,
                loading: false,
                refreshing: false
            })
        })
        .catch(error =>
            this.setState({
                error,
                loading: false
            })
        )
};
renderSeparator = () => {
    return (
        <View
            style={{
                height: 1,
                width: "86%",
                backgroundColor: "#CED0CE",
                marginLeft: "14%"
            }}
        >
        </View>
    )
};



render() {
    return (
        <FlatList
            data={this.state.data}
            renderItem={({ item }) => (
                <ListItem
                    roundAvatar
                    title={`${item.name.first} ${item.name.last}`}
                    subtitle={item.email}
                    avatar={{ uri: item.picture.thumbnail }}
                    containerStyle={{ borderBottomWidth: 0 }}
                />
            )}

            ItemSeparatorComponent={this.renderSeparator}
            onEndReachedThreshold={50}
        />        )
}}

Обязательно ли использовать ScrollView, чтобы иметь возможность прокручивать родной вид реакции, или мы можем это сделать используя любой CSS или что-то еще

1 Ответ

0 голосов
/ 04 сентября 2018

Когда я попытался запустить этот код по данной ссылке: https://snack.expo.io/rkOsCaiD7, чтобы найти решение, которое я нашел, было представление прокрутки, работающее отлично с вышеуказанным кодом. Просто попробуйте перезагрузить и запустить его в соответствии с исходным кодом, с помощью которого я чувствую, что это может решить вашу проблему.

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