React Native ScrollView/ListView RefreshControl 最初在右上角很难看

Question

我有一个 RefreshControl 附加到 ScrollView。一切都按预期工作，但最初（当我没有开始滚动时），右上角总是显示 RefreshControl。当我开始滚动时，它消失了。

知道如何摆脱它吗？

代码没什么特别的，要的话我给你：

// ...
export default class SomeList extends React.Component
{
    // ...
    render() {
        return <View style={{flex: 1}}>
            <CustomNavbar />
            <ScrollView 
                style={{marginTop: 35}}
                refreshControl={
                    <RefreshControl
                        tintColor={$.config.colors.style}
                        onRefresh={() => this._refreshList()}
                        refreshing={this.state.listRefreshing}
                    />
                }
            >
                {this._renderItems()}
            </ScrollView>
        </View>
    }
}

Answer 1

这是react-native 0.31左右版本引入的bug。它已在 0.34.1 版中修复（参见 this commit），所以我猜你使用的是以前的版本。

如果不想升级，可以通过将刷新控件的背景色设置为透明来临时解决： <RefreshControl style={{backgroundColor: 'transparent'}}/>

React Native ScrollView/ListView RefreshControl 最初在右上角很难看

React Native ScrollView/ListView RefreshControl intitially ugly on top right

javascript

scrollview

ios

pull-to-refresh

react-native