Question

我的反应原生应用程序上有一个图形错误，它只出现在iOS上，而不是在Android上。

当我更新历史记录屏幕的应用程序状态时（在启动时，或者当我添加一个骑行，或当我移除一个骑行时），我的历史骑行项目列表消失（使用反应本机ListView实现）。我需要触摸屏幕才能显示出来。之后，在屏幕之间导航期间，我没有任何问题（因为我没有重新渲染历史记录屏幕）。

我使用redux + reactnavigation。在启动时，我使用一个共同的动作＆＃34; LOAD_RIDES＆＃34;我在每个屏幕缩减器中重用以更新其状态。与动作ADD_RIDE，REMOVE_RIDE相同。

但是我发现，如果我在启动时自动导航到历史记录（通过要求我的导航减速器在启动时转到历史记录），并且屏幕更新发生之后，当历史屏幕已经显示时，我不会＃39; t有这个bug（隐藏了历史项目）。

知道如何解决这个问题吗？谢谢！

"react": "16.0.0-alpha.6",
"react-native": "0.44.0",
"react-navigation": "1.0.0-beta.9",
"react-redux": "^5.0.3",

重现错误，我创建了回购：https://github.com/jcharlet/react_native_listview_bug

有趣的作品是HistoryScreen，其中创建了listView。 https://github.com/jcharlet/react_native_listview_bug/blob/master/src/screens/history/HistoryScreen.js

主分支显示操作中的错误 unsatisfying_workaround分支显示如果我在更新状态之前显示历史记录屏幕，它会正确显示列表。

到目前为止，我尝试过

失败了

使用ListView.scrollTo
在导航到历史记录屏幕时再次使用redux加载游乐设施
升级做出反应并对原始版本作出反应
生成单独的redux动作，用于在历史记录屏幕中加载游乐设施＆＃39; LR＆＃39; （否则我在hackDetails和History屏幕中使用相同的LOAD_RIDES动作来更新它们的状态）

在Chrome开发工具中，我在使用导航工作之前/之后查看了redux状态（在加载游乐设施之前导航到历史记录屏幕）以及当我没有改变时：<没有任何变化。< / p>

Answer 1

反应原生的bug 我的问题已经提出https://github.com/facebook/react-native/issues/14069，重复到https://github.com/facebook/react-native/issues/1831

引用回答的人：

可以通过将removeClippedSubviews = {false}添加到ListView来解决。它可能会导致一些性能问题，具体取决于您的列表大https://facebook.github.io/react-native/docs/listview.html#removeclippedsubviews，但这就是我们一直在使用的。

（在William撰写关于属性拼写的评论后编辑）

Answer 2

我通过稍微延迟设置数据源找到了解决方法。

在componentWillMount方法中从远程源加载数据时，将运行以下代码。似乎工作：

setTimeout(function(){
       this.updateDataSource(array,newArray)
},300)

updateDataSource = (comments,dataSource) =>{
        this.setState({
            allComments:comments,
            dataSource: this.state.dataSource.cloneWithRows(dataSource),
            isLoading:false

        })
}

在轻微延迟期间，您始终可以显示加载屏幕。它太短了，甚至都看不到。

listView不显示，除非我滚动它

2 个答案: