Question

我单击一个屏幕上的按钮，该按钮加载另一个屏幕，其中包含一个呈现多行的平面列表。我的难题是，当平面列表处理时，我会挂在第一个屏幕上。

到目前为止，我的最大努力是加载器，隐藏this.props.children来处理平面列表，然后隐藏加载器并再次显示this.props.children。

我确定必须采用更符合逻辑的方法吗？

的Ta，

克里斯

Answer 1

首先反而隐藏平面列表并显示您可以使用的装载程序从React-native刷新控件。我们将做同样的工作轻松。
第二，如果您的列表很长，您可以使用onEndReached回调延迟加载数据，这将减少加载时间。
第三个使你的flatComponent在flatlist中成为一个纯粹的组件。它将停止不必要的刷新并提高性能。

检查以下代码.....

＆＃13;

         <FlatList
            data={this.props.questions}
            renderItem={({ item, index }) => <QuestionCard              //your pure component 
              item={item}
              index={index}
              onPress={this.openQuestionDetail}
            />
            }

            ref={'flatlist'}
            refreshControl={
              <RefreshControl                                //imported from react-native
                refreshing={isFetching}                  //used to show loader while loading
                onRefresh={this.fetchQuestions}
                title="Pull to refresh"
                tintColor="#fff"
                titleColor="#fff"
                colors={[Colors.secondary_button]}
              />
            }
            onEndReached={this.handleDynamicLoading}     //callback for lazyloading
            onEndReachedThreshold={0.5}
            keyExtractor={(item, index) => item.qid}
          />

＆＃13;

希望这有助于......：）

导航和平面列表的逻辑方法

1 个答案: