Question

假设您有一个从您的API传入的People列表。

[{content: 'John'},
{content: 'Tim'},
{content: 'Harry J. Epstein'}]

并且您希望将以名字为基础的朋友（约翰和蒂姆）置于“朋友”的一个部分之下。以及那些不是（Harry J. Epstein）＆＃39; Contacts＆＃39;。

的人

点击朋友选择蓝色突出显示，但点击“联系人”按钮＆＃39;用红色高光选择它们。

正确的方法是从API获取传入的数据，在其周围添加type: 'Friend', ...或type: 'Contact', ...，以及基于该类型的部分，单独使用FriendItem和{{ 1}}类所以我可以拆分突出显示功能吗？

我有一堆基本的ListView代码可以完成这种方法，但我基本上都在寻找简单的方法，比如Angulars ContactItem等效。

那么

的React Native版本是什么？

ng-repeat

我很难理解如何拆分它。我需要var friends = api.getFriends() var contacts = api.getContacts() <div ng-repeat="friend in friends" ng-click="highlightFriend()"> ... </div> <div ng-repeat="contact in contacts" ng-click="highlightContact()"> ... </div>，FriendsPage和FriendsItem吗？或者将所有内容放在ContactsItem中的一个数组中，然后使用FriendsPage检查它是朋友还是联系人并单独添加功能？

我觉得我从MVC那里稍微迷失了。我也有Redux运行，如果有一个简单的方法使用它。

Answer 1

以下是关于如何创建与部分相关的行的一个很好的示例：https://github.com/spoeck/ListViewExample

这个想法基本上是正确创建数据blob，这有点棘手，然后在renderRow回调中，检查sectionID参数：

_renderRow(rowData: any, sectionID: any, rowID: number) {

    if (sectionID === this.data[0].section) {
        return <MyFriends />

    } else if (sectionID === this.data[1].section) {
        return <MyContacts />

    }else{ 
     // ...
    }

}

Answer 2

为什么不试试SectionList

请改用新的FlatList或SectionList组件。除了简化API，新的列表组件也具有重要意义性能增强，主要是几乎恒定的内存用于任意数量的行。

在ListView中划分数据

2 个答案: