Измените цвет кнопки после выбора и отмените выбор выбранной кнопки, если выбрана вторая кнопка

const renderitem = () => {
    return (
      <TouchableHighlight
        onPress = {props.onClick}
      >
       <Text>{props.title}</Text>
      </TouchableHighlight>
    );
  };

Я создаю функцию для отображения кнопки в Flatlist, теперь может быть несколько кнопок на основе данных в flatlist, когда я выбираю одну кнопку, я хочу изменить цвет выбранной кнопки, а когда я выбираю другую кнопку, я хочу отменить выбор 1-я кнопка, которая была выбрана, а также измените цвет 1-й кнопки на исходный цвет, а теперь измените цвет 2-й кнопки, как она была выбрана в данный момент, пожалуйста, дайте мне знать, как я могу этого добиться.

Умерло ли Create-React-App?
Умерло ли Create-React-App?
В этом документальном фильме React.dev мы исследуем, мертв ли Create React App (CRA) и какое будущее ждет этот популярный фреймворк React.
Освоение React Native: Пошаговое руководство для начинающих
Освоение React Native: Пошаговое руководство для начинающих
React Native - это популярный фреймворк с открытым исходным кодом, используемый для разработки мобильных приложений. Он был разработан компанией...
В чем разница между react native и react ?
В чем разница между react native и react ?
React и React Native - два популярных фреймворка для создания пользовательских интерфейсов, но они предназначены для разных платформ. React - это...
От React к React Native: Руководство для начинающих по разработке мобильных приложений с использованием React
От React к React Native: Руководство для начинающих по разработке мобильных приложений с использованием React
Если вы уже умеете работать с React, создание мобильных приложений для iOS и Android - это новое приключение, в котором вы сможете применить свои...
Хуки React: что это такое и как их использовать
Хуки React: что это такое и как их использовать
Хуки React - это мощная функция библиотеки React, которая позволяет разработчикам использовать состояние и другие возможности React без написания...
0
0
20
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Пожалуйста, используйте переменную состояния в качестве цвета стиля. например style = {color:buttonColor1}

Ответ принят как подходящий
const App = () => {
  const [options, setOptions] = useState<string[]>(['One', 'Two', 'Three'])
  const [selected, setSelected] = useState('One')

  const Item = ({ item, index }) => (
    <Pressable onPress = {() => setSelected(item)}>
      <Text style = {{ color: selected === item ? '#ff00ff' : '#000000' }}>
        {item}
      </Text>
    </Pressable>
  )

  return (
    <FlatList
      data = {options}
      renderItem = {Item}
    />
  )
}

Другие вопросы по теме