1

我的数据是这样的：

[
  [
    'id' => 1,
    'date' => '2021-04-19',
    'name' => 'John Doe',
    'payment' => 25
  ],
  [
    'id' => 2,
    'date' => '2021-04-19',
    'name' => 'Mary Doe',
    'payment' => 23
  ],
  [
    'id' => 3,
    'date' => '2021-04-18',
    'name' => 'Peter Pan',
    'payment' => 30
  ],
  [
    'id' => 4,
    'date' => '2021-04-18',
    'name' => 'Mike Myers',
    'payment' => 18
  ],
  [
    'id' => 5,
    'date' => '2021-04-17',
    'name' => 'Jack Cole',
    'payment' => 28
  ]
]

我想要这样的输出：

2021-04-19
---------------------
| John Doe - 25     |
---------------------
| Mary Doe - 23     |
---------------------

2021-04-18
---------------------
| Peter Pan - 30    |
---------------------
| Mike Myers - 18   |
---------------------

2021-04-17
---------------------
| Jack Cole - 28    |
---------------------

在我的渲染方法中，我有这个：

return (
  <View style={styles.container}>
    <FlatList
      data={myjsondata}
      keyExtractor={(item: any) => item.id}
      renderItem={this._renderList}
      showsVerticalScrollIndicator={false}
    />
  </View>
);

我的_renderList功能是这样的：

  _renderList = ({item}:any) => {
    return (
      <View>
        <Text>{item.date}</Text>
        <TouchableOpacity>
          <View>
            <Text>
              {item.name}
            </Text>
            <Text>
              ${item.payment}
            </Text>
          </View>
        </TouchableOpacity>
      </View>
    );
  };

我尝试过使用状态，但显然它不能在 renderList 循环中使用。这可以通过 Flatlist 来实现，还是应该使用 SectionList 来代替？提前致谢 ：）

4

0 回答 0