React Native Input List Components
A React Native library with input components.
Components
- InputText - Text/Numeric input field
- InputCountrySelector - Country selector input field
- InputSwitch - Switch input field
Install
npm install --save react-native-input-list
Usage
;;; { const firstValue = `First input: \n`; const secondValue = `Second input: \n`; const thirdValue = `Third input: \n`; const fourthValue = `Fourth input: \n`; const fifthValue = `Fifth input: \n`; const sixthValue = `Sixth input: \n`; const text = firstValue + secondValue + thirdValue + fourthValue + fifthValue + sixthValue; Alert; } { const firstValid = `First input: \n`; const secondValid = `Second input: \n`; const thirdValid = `Third input: \n`; const fourthValid = `Fourth input: \n`; const fifthValid = `Fifth input: \n`; const text = firstValid + secondValid + thirdValid + fourthValid + fifthValid; Alert; } { thisrefsfirstInput; thisrefssecondInput; thisrefsthirdInput; thisrefsfourthInput; thisrefsfifthInput; } { ; } { return <View style=stylescontainer> <Text style=stylestitle>Inputs</Text> <View> <InputText ref="firstInput" required type="withLabel" label="With label"/> <InputText ref="secondInput" label="Without label"/> <InputText ref="thirdInput" keyboardType="numeric" label="Numeric"/> <InputText ref="fourthInput" type="withLabel" label="With styles" containerStyles=stylesinputStyles/> <InputCountrySelector ref="fifthInput" label="Select your country" /> <InputSwitch ref="sixthInput" defaultValue=false onChange=thisswitchChanged label="Are you alive?"/> </View> <View> <TouchableOpacity onPress=thisshowValues> <Text style=stylesaction>SHOW VALUES</Text> </TouchableOpacity> <TouchableOpacity onPress=thisareValid> <Text style=stylesaction>VALID?</Text> </TouchableOpacity> <TouchableOpacity onPress=thisshowErrors> <Text style=stylesaction>SHOW ERRORS</Text> </TouchableOpacity> </View> </View> ); }} const styles = StyleSheet;