Использование компонентов 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>
}