To querendo fazer um componente geral que possa ser alterado conforme as necessidades no meu projeto (treino). Do jeito que estou fazendo a variavel passada não é reconhecida no styles. É possível fazer?
export default function InputPadrao({ nameIcon, placeholder, keyBoardType, qtd}){
return(
<View style={estilos.view}>
<MaterialCommunityIcons name= {nameIcon} size={35} color="white" />
<TextInput style={estilos.input} placeholder={placeholder} placeholderTextColor= '#fff' keyBoardType={keyBoardType}/>
</View>
)
};
const estilos = StyleSheet.create({
input: {
borderWidth: 1,
paddingLeft: 10,
paddingVertical:3,
borderRadius: 30,
borderColor: '#fff',
width: qtd ===2? '37%' : qtd===3? '25%': '75%',
height: 40,
},
view: {
backgroundColor: 'grey',
flexDirection: 'row',
width:'100%',
justifyContent: 'space-around',
alignItems: 'center',
}
});