RefreshControl仅出现在水平ScrollView(iOS)中的第一个孩子的顶部

Fid*_*kaj 6 uiscrollview ios uirefreshcontrol pull-to-refresh react-native

我有一个用例,我想列出水平卡片.我用水平ScrollView实现了它.

然后,对于每张卡,我想实现拉动 - 刷新模式,以便更新卡中显示的数据.因此我使用RefreshControl组件作为ScrollView的属性.

问题是在iOS上,当我切换到另一张卡而不是第一张时,我看不到RefreshControl组件(参见下面的gif).

带刷新控制iOS的水平滚动

<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>
Run Code Online (Sandbox Code Playgroud)

以下演示中的完整代码

演示 https://rnplay.org/apps/sRXpEw

编辑

它看起来与代码的这一部分有关:Libraries/Components/ScrollView/ScrollView.js#L523-L529

Eri*_*nti 1

据我所知,这是预期的行为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>
Run Code Online (Sandbox Code Playgroud)