Как использовать хуки в цикле?

Question

[Portal_Shooter]

Есть список блоков. Надо сделать так, чтобы при клике менялся стиль этого блока. Не знаю как это реализовать. Я знаю, что в цикле нельзя этого делать из-за возможности нарушения порядка хуков, но как-то же это можно реализовать?

<FlatList
  data={arr}
  numColumns={7}
  renderItem={item => {
    item.state = 'noActive';
    console.log(item);
    return (
      <TouchableWithoutFeedback
        onPress={() => (item.state = 'active')}
        style={styles.fullContainer}>
        <View style={[styles.block, styles[item.state]]}>
          <Text>{item.item.name}</Text>
        </View>
      </TouchableWithoutFeedback>
    );
  }}
/>

Answer 1

[Илья Березанский]

но как-то же это можно реализовать?

Вы можете создать отдельный компонент для TouchableWithoutFeedback и хранить состояния и стили в нём.