前提・実現したいこと
ReactNativeでログイン画面を作成しようとしています。
わからないこと
ソースコードを見ながらTextInputを実装しているのですが、{text}というものが出てきて
それが理解できません。呼び出し元のプロパティにtextというものを指定していないのに、なぜ値が入るのでしょうか。
該当のソースコード
js
1const Input = ({onChangeText, icon, style, text, label,iconPosition, error, ...props}) => { 2 3 const [focused, setFocused] = React.useState(false); 4 5 6 const getFlexDirection = () =>{ 7 8 if(icon && iconPosition){ 9 if(iconPosition==="left"){ 10 return "row"; 11 } 12 else if(iconPosition==="right"){ 13 return "row-reverse"; 14 } 15 } 16 }; 17 18 const getBorderColor=()=>{ 19 if(error){ 20 return colors.danger; 21 } 22 if(focused){ 23 return colors.primary; 24 } 25 26 else{ 27 return colors.grey; 28 } 29 } 30 return ( 31 <View style={styles.inputContainer}> 32 {label && <Text>{label}</Text>} 33 <View style={[styles.wrapper,{alignItems:icon ? 'center':'baseline' },{borderColor:getBorderColor(),flexDirection: getFlexDirection()}]}> 34 <View>{icon && icon}</View> 35 <TextInput 36 style={styles.textInput} 37 onChangeText={onChangeText} 38 value={text} 39 onFocus={()=>{setFocused(true)}} 40 onBlur={()=>{setFocused(false)}} 41 {...props} 42 /> 43 </View> 44 45 {error && <Text style={styles.error}>{error}</Text>} 46 </View> 47 ) 48} 49 50 51 52export default Input
呼び出し元
<Input label="email" iconPosition="right" placeholder="Enter Email" onChangeText={(value)=>{ onChange({name: "email", value}) }}>
試したこと
呼び出し元のInputにtext="test"といれてみると、
TextInputに入力すると常に"test"が入るようになり、ますます意味がわかりません。
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。