Programing

플랫리스트에서 react enative native의 모든 항목을 나열하지 않는가?

c10106 2022. 3. 26. 15:33
반응형

플랫리스트에서 react enative native의 모든 항목을 나열하지 않는가?

나는 시차 효과로 반응-원추-기차-두부 npm을 사용해 왔다.시차 안에서는 평면 리스트를 사용해 왔다.

매번 새로운 카테고리 플랫리스트를 추가할 때마다 API에서 가져온 항목을 다시 로드해야 하지만 내 경우에는 모든 항목이 나열되지 않는다.배열의 마지막 두 항목만 표시된다.나의 배열 값은 10개의 항목을 포함하지만 2개의 항목만 표시된다.

플랫리스트에 대한 코드:

     const renderContent = (label) => (
        <View style={{ backgroundColor: '#FBFCFF', top: -10 }}>

            <CategoryListView>
                {this.state.categories && <FlatList
                    horizontal={false}
                    data={this.state.categories}
                    contentContainerStyle={{ paddingBottom: 20 }}
                    refreshControl={
                        <RefreshControl refreshing={refreshing} onRefresh={this.loadCategories} />
                    }
                    showsHorizontalScrollIndicator={false}
                    showsVerticalScrollIndicator={true}
                    renderItem={({ item }) => { return <CardActivity gotoCategoryDetail={this.gotoCategoryDetail} key={item._id} category={item}></CardActivity> }}
                    keyExtractor={(item) => item._id}
                />}
            </CategoryListView>

        </View>
    )

다음은 get 카테고리 목록

loadCategories = async () => {
    this.setState({ refreshing: true });
    let categories = await this.props.getCategories();
    console.log(categories)
    this.setState({ categories, lastFetchCategoriesTime: new Date() });
};

여기 생성자 코드가 있다.

 constructor(props) {
    super(props);
    this.state = {
        categories: [],
        refreshing: false,
        scrollEnd: false,
    }

    this.loadCategories();
    const { navigation } = this.props;
    this.focusListener = navigation.addListener("focus", () => {
        // Call ur function here.. or add logic.    
        console.log(':::this will fire every time Page 1 receives navigation focus:::');
        this.loadCategories();
    });
};

어떤 도움이라도 고맙게 생각한다.

참조URL: https://stackoverflow.com/questions/69258926/flatlist-does-not-listing-all-items-in-react-native

반응형