问题标签 [react-native-listview]

我有一个使用有一些性能问题的 Sticky Headers 的 ListView。当我控制台登录各种渲染方法时，我注意到我正在重新渲染......很多。我是否应该确定是否在 react-native 和 react 中大量使用 shouldComponentUpdate 进行更新？React 使用虚拟 DOM 并且可以选择性地更新 DOM 的部分，因此我们通常不会遇到像我在 react-native 中看到的性能问题。

react-native 是否以与 react 相同的方式选择性地更新，或者如果渲染方法运行，它是否总是在渲染该组件？

更新：我在我的 ListView 行组件中添加了一些 shouldComponentUpdate() 方法，以便仅在需要时选择性地更新，它肯定有助于提高性能。

更新 2：此引用直接来自 react-native 文档的性能部分。http://facebook.github.io/react-native/releases/0.36/docs/performance.html

同样，您可以实现 shouldComponentUpdate 并指明您希望组件重新渲染的确切条件。

我希望从使用过 react-native（不仅仅是 react/redux，还有 react-native）的人那里获得共识，以了解他们是否也发现自己也经常使用 shouldComponentUpdate() 来提高性能。

我有一个获取初始数据源的 ListView。然后，用户可以运行搜索，该搜索将使用新的 DataSource 更新 ListView。不幸的是，当这种情况发生时，滚动位置会被重置，这并不理想。

我尝试重用相同的 ListView.DataSource 对象而不是创建一个新对象，但这给了我相同的结果：

更改数据源后，我尝试在 ListView 上使用 scrollTo，但这种情况下应用程序会跳来跳去很多......不是一个很好的体验。是否有 ListView 设置或不同的方式来更新数据源，以防止滚动位置重置？

ListView 有 2 个粘性标题，顶部标题有 2 行页面描述和一个渲染 3 个图像网格的 redux 容器。第二部分列出了多达 50 个渲染起来有些繁重的组件：一个方形图像、一些文本和一些 SVG。我当前的方法使用 onContentSizeChange 来强制滚动位置，但这会导致滚动位置跳跃并且看起来很业余。

更新：深入研究 ListView 的文档和源代码，它最终只会呈现一个 ScrollView。我可以使用contentOffset来设置初始滚动位置，但是当 ListView DataSource 更新时它似乎没有帮助；即使硬编码 contentOffset 也无济于事。我还尝试将scrollEnabled设置为 false，这确实阻止了用户驱动的滚动，但是 ListView 滚动位置在其 DataSource 更新时仍会重置：s

更新 2：我做了一些进一步的调试，发现建议的 rowHasChange 和 sectionHeaderHasChanged 函数在只渲染需要渲染的行/节标题方面做得很好。

这是错误

我很难从 ListView 中删除一行。无论单击哪个，它都会删除列表的最后一个元素。但是，console.log 告诉我该数组已正确删除该项目，但它呈现错误......互联网上已经有一些解决方案，但没有一个可以帮助我解决我的问题。

我的问题的 GIF

日志

如您所见，它实际上确实删除了正确的项目，但显示了错误的数组？

Nov 6 22:18:39 Viviennes-Air reminders[25992] <Notice>: { rowID: '0' } Nov 6 22:18:39 Viviennes-Air reminders[25992] <Notice>: [ 'testing 2', 'testing 3' ] Nov 6 22:18:39 Viviennes-Air reminders[25992] <Notice>: { _rowHasChanged: [Function: rowHasChanged], _getRowData: [Function: defaultGetRowData], _sectionHeaderHasChanged: [Function], _getSectionHeaderData: [Function: defaultGetSectionHeaderData], _dataBlob: { s1: [ 'testing 2', 'testing 3' ] }, _dirtyRows: [ [ false, false, true ] ], _dirtySections: [ false ], _cachedRowCount: 3, rowIdentities: [ [ '0', '1', '2' ] ], sectionIdentities: [ 's1' ] }

这是我的构造函数：

列表视图：

渲染行函数：

最后，删除功能：

我已经尝试了 2 个小时来解决这个问题，我很确定我做的一切都是正确的。

我正在尝试在我的 React Native ListView 中实时列出我的 Firebase 数据库项目。但是，使用以下代码，当我在构造函数中初始化 dataSrouce 状态时，我收到一条错误消息，指出“未定义不是构造函数”。我应该怎么做才能让它工作？谢谢。

使用ListViewreact-native 中的组件 - 是否可以在这样的部分中呈现行？

而不是这样：

我正在使用renderRow 和renderSectionHeader。

我想这样渲染的原因是由于样式。但也许我需要有两个嵌套ListView呢？

我正在尝试使用适用于 Android 的 React Native（版本 0.37.0），并尝试制作一个简单的应用程序来学习。在成功制作了一个按钮转到下一页后，现在我希望用户通过单击 ListView 中的项目进入下一页（就像您在网上商店单击一个项目，它会进入下一页，显示项目的信息）。这是我的代码：

上面的代码中有两个可以点击的东西：ListView 的 item 和 Button Add。两者都执行相同的方法。按钮添加按预期工作，用户在单击时导航到下一页。然而，当 ListView 的项目单击时，它没有。颜色改变就像单击按钮时一样，显示警报“kyaa”，但不会转到下一页（即使删除了警报，仍然相同）。

我做错了什么？

我正在处理<ListView>组件，我有一个名称列表，但是在更改状态后，它正在更改值，但它没有重新渲染 ListView。

isSelect:false - (状态)

isSelect:true - (状态)

代码：

请仔细阅读我上面的代码，如果您找到任何解决方案，请告诉我。

谢谢

当我将数据源设置为我的列表视图时，刷新控件（下拉刷新）工作得非常好。如果数据源为空，我无法下拉刷新列表视图。

我的列表视图如下所示：

即使数据源为空/null，我是否需要将任何道具设置为 Listview 或任何其他方式以启用下拉刷新列表视图？

我正在寻找这个功能，因为我第一次从异步存储加载数据。在下拉刷新时，我清除存储并获取新数据。

我是一般反应 Native 和 Javascript 编程的新手，我试图在 React Native 和 redux 中创建一个简单的“待办事项”应用程序。

我试图在我的减速器中的数组中添加一个“待办事项”，如下所示。

结果显示 AddToDo 结果 ，您可以看到“第一件事”和“第二件事”是我添加的两个结果，它们连接到同一行。

我的第一个想法是我的愚蠢或演示 ListView 有问题，它的数据如下所示。

所以我尝试了这个...

它有效！这就是我认为错误出在减速器中的原因。

请让我知道还有哪些其他代码有用。任何见解将不胜感激。

这就是行动。