Использование компонентов FlatList и react-native-table-component приведет к медленной отрисовке всей страницы - PullRequest
0 голосов
/ 27 мая 2020

Использование компонентов FlatList и response-native-table-component приведет к медленному отрисовке всей страницы, например: когда я нажимаю кнопку, чтобы изменить цвет кнопки, отрисовка выполняется очень медленно, но если я прокомментирую l oop код на картинке, он вернется к нормальному рендерингу, как решить эту проблему

<Table style={{ marginTop: 10, }}>
  <FlatList
    data={dateRows}
    initialNumToRender={4}
    keyExtractor={(item, index) => index.toString()}
    renderItem={this._renderItem}
  />
</Table> 
_renderItem = ({ item, index }) => {
  const element = (data, col, temp, index) => (
    col == 1 && index != 7 ?
      <Button style={[styles.timeStyle, styles.available]} onPress=
        {() => this.toBook(temp, index, col)}>
        <Text style={styles.descText}>{data}</Text>
      </Button> : index != 7 && col == 2 ?
        <Button style={[styles.timeStyle]} >
          Text style={[styles.descText, styles.bookedText]}>{data}</Text>
     </Button > : index != 7 ?
    <Button style={styles.timeStyle} >
      <Text style={[styles.descText, styles.bookedText]}>{data}</Text>
    </Button> : null

  );
  return <TableWrapper key={index} style={styles.row}>
    {
      item.data.map((cellData, cellIndex) => (
        <Cell key={cellIndex} data={element(item.time, item.data[cellIndex], item, cellIndex)} style={{ width: 120, marginBottom: 10, }} textStyle={styles.text} />
      ))
    }
  </TableWrapper>
} 
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...