Kir*_*odi 3 reactjs react-native react-native-android react-native-ios react-native-0.46
我为TextInput创建了通用类,并多次使用了它,但是它的事件句柄具有相同的方法。我想在将数据填充到textInput中之后处理数组数据。
在这里添加了多个textField和single handleAddMore。如何识别哪个textInput称为handleAddMore。
textField组件根据数组数据动态添加。现在,当用户编辑textInput时,我想在特定索引上标识textInput和更新的数组文本。
let addMoreCompView = this.state.dataAddMore.map((data ,index) =>{
return(
<View style ={[styles.commonMargin ,{flexDirection : 'row',marginTop : 2 , height : 40, backgroundColor : Globle.COLOR.INPUTCOLOR}]}>
<View style = {{height : '100%' , width : '80%' , justifyContent: 'center' ,alignItems: 'flex-start', flexDirection : 'column'}}>
<TextInput style = {{fontFamily: 'Gotham-Light',fontSize : 14 ,color: Globle.COLOR.BACKCOLOR , paddingLeft : 20}}
underlineColorAndroid = "transparent"
placeholder = 'Please enter emailID.'
placeholderTextColor = 'black'
autoCapitalize = "none"
keyboardType = "email-address"
onSubmitEditing ={Keyboard.dismiss}
onChangeText = {this.handleAddMore}
autoCorrect = {false}/>
</View>
<TouchableOpacity onPress = {() => this.removeMoreComponent(data.key)} style = {{height : '90%' , width : '20%' , alignItems: 'flex-end', justifyContent: 'center'}}>
<Image style = {{width : 9 , height : 10 , marginRight : 20}} source = {require('./Images/cancelMore.png')}/>
</TouchableOpacity>
</View>
)
});
Run Code Online (Sandbox Code Playgroud)
在这里,我想确定哪个TextInput称为此方法。
在这里我要给textField的文本和索引。
handleAddMore = (text) =>{
// Here I want to text and index of textField.
}
Run Code Online (Sandbox Code Playgroud)
小智 7
_handleMultiInput(name) {
return (text) => {
this.setState({ [name]:text })
}
}
<TextInput
placeholder='enter your name.'
onChangeText={_handleMultiInput('myName')}
/>
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
3792 次 |
| 最近记录: |