Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6287

How to select a button in React Native, without selecting others?

$
0
0

I have a simple quiz app that always has the same answers, with different points to each one.

When USER presses, I want the button to be selected, change color, pass the id to a state.When USER presses another, I want to de-select the first button and select this instead.

Using React functional components, ReactHooks, styled-components and TypeScript.

the buttons:

<AnswerButton  id="1"  isSelected={isSelected}  style={shadow}  onPress={handleAnswer}><AnswerText>Muito Correto</AnswerText></AnswerButton><AnswerButton      id="2"      style={shadow}      isSelected={isSelected}      onPress={handleAnswer}><AnswerText>Moderadamente Correto</AnswerText></AnswerButton>

styled-components:

    export const AnswerButton = styled.TouchableOpacity<AnswerProps>  background: ${darken(0.05, #EEEDED)};  border-radius: 35px;  padding: 15px;  margin-bottom: 25px;  border: 2px solid #64007b;  ${props =>    props.isSelected &&    css      border-color: #c53030;      background-color: #fff8f7;      border-width: 2px;    };export const AnswerText = styled.Text  color: #64007b;  font-family: 'RobotoSlab-Medium';  font-size: 18px;  line-height: 30px;  text-align: center;;

Viewing all articles
Browse latest Browse all 6287

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>