RefreshControl仅在水平滚动视图(iOS)中出现在第一个孩子的顶部
问题描述:
我有一个用例,我想列出水平卡片。 我用水平的ScrollView实现了它。RefreshControl仅在水平滚动视图(iOS)中出现在第一个孩子的顶部
然后,对于每张卡,我想执行拉到刷新模式,以便更新卡中显示的数据。 因此,我使用RefreshControl组件作为ScrollView的属性。
问题是,在iOS上,当我切换到第一张以外的另一张卡时,我看不到RefreshControl组件(请参见下面的gif)。
代码
<ScrollView
contentContainerStyle={styles.container}
horizontal
pagingEnabled
showsHorizontalScrollIndicator={false}
directionalLockEnabled
contentInset={{top: 1}}
refreshControl={
<RefreshControl
refreshing={this.state.isRefreshing}
onRefresh={this._onRefresh.bind(this)}
/>
}
>
<Text style={styles.card}>First child</Text>
<Text style={styles.card}>Second child</Text>
</ScrollView>
在演示的完整代码如下
演示https://rnplay.org/apps/sRXpEw
编辑
它看起来关系到这部分代码:Libraries/Components/ScrollView/ScrollView.js#L523-L529
答
据我所知,这是预期的行为refreshControl
- 只存在应该是一个。
这会适用于您的应用程序?
<ScrollView
contentContainerStyle={styles.container}
horizontal
pagingEnabled
showsHorizontalScrollIndicator={false}
directionalLockEnabled
contentInset={{top: 1}}
>
<ScrollView
refreshControl={
<RefreshControl
refreshing={this.state.isRefreshing}
onRefresh={this._onRefresh.bind(this)}
/>
}><Text style={styles.card}>First child</Text></ScrollView>
<ScrollView
refreshControl={
<RefreshControl
refreshing={this.state.isRefreshing}
onRefresh={this._onRefresh.bind(this)}
/>
}><Text style={styles.card}>Second child</Text></ScrollView>
</ScrollView>