Jak zmienić tło wybranego elementu w liście przycisków

Wyświetlam listę i chciałbym po wybrać jeden z rekordów aby tło tego rekordu zmieniło się

function HoursComponent({id, time}) {
    const TimewithoutLast3 = time.slice(0, -3);
    return (
        <View style={styles.rootContainer}>
            <TouchableOpacity >
                <Text style={styles.buttonText}>{TimewithoutLast3}</Text>
            </TouchableOpacity>
        </View>
    );
}

<FlatList
    numColumns={4}
    data={newItem}
    keyExtractor={(item) => item.id}
    renderItem={({ item }) => (<HoursComponent {...item} />)} />

rootContainer: {
  borderRadius: 7.3,
  borderStyle: "solid",
  borderWidth: 1.3,
  borderWidth:2,
  width: 80,
  height: 30,
  borderColor: Colors.sandy,
  textAlign: 'center',
  justifyContent: 'center',
  margin: 5,
//   padding: 20,
},

Utwórz nowy stan z kolorem tła w komponencie HoursComponent i ustaw mu domyślną wartość, np. const [bgColor, setBgColor] = useState('#ffffff'). Dla View nadpisz style w taki sposób: style={{...styles.rootStyles, backgroundColor: bgColor}} by kolor tła był pobierany dynamicznie z utworzonego stanu. Złap event przy kliknięciu na rekord; dla TouchableOpacity do atrybutu onPress przypisz funkcję ustawiającą stan na nowy kolor, np. setBgColor('#ff0000'). To tak w skrócie.

@Szado Dzięki za pomoc. Mam jeszcze jedno pytanie bo w tej chwili mogę oznaczyć kilka przycisków a co jakbym chciał żeby można było oznaczy tylko jeden?