const renderitem = () => {
return (
<TouchableHighlight
onPress = {props.onClick}
>
<Text>{props.title}</Text>
</TouchableHighlight>
);
};
Я создаю функцию для отображения кнопки в Flatlist, теперь может быть несколько кнопок на основе данных в flatlist, когда я выбираю одну кнопку, я хочу изменить цвет выбранной кнопки, а когда я выбираю другую кнопку, я хочу отменить выбор 1-я кнопка, которая была выбрана, а также измените цвет 1-й кнопки на исходный цвет, а теперь измените цвет 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}
/>
)
}