当我在TextInput中输入内容时,我会第一次触摸FlatList项目之一。它应该是console.log(' item press'),但事实并非如此。只有第二次触摸它控制台。有人知道原因吗?
这是我的代码。
<TextInput
placeholder='test'
value={this.state.inputText}
onChangeText={(inputText) => this.setState({inputText})}
style={{marginBottom: 20, fontSize: 17, width: 300, textAlign: 'center'}}
/>
<FlatList
data={[{key: 'item 1'}, {key: 'item 2'}]}
renderItem={({item}) =>
<TouchableHighlight onPress={() => console.log('item press')}
underlayColor='#dddddd'>
<View style={{height: 40}}>
<Text style={{fontSize: 16, textAlign: 'center'}}>{item.key}</Text>
</View>
</TouchableHighlight>
}
/>
答案 0 :(得分:12)
您应该使用FlatList
keyboardShouldPersistTaps={'handled'}
道具,并通过Keyboard.Dissmiss()
在另一个功能中关闭键盘。您的FlatList
将是这样的:
<FlatList
keyboardShouldPersistTaps={'handled'}
data={[{key: 'item 1'}, {key: 'item 2'}]}
renderItem={({item}) =>
<TouchableHighlight onPress={() => console.log('item press')}
underlayColor='#dddddd'>
<View style={{height: 40}}>
<Text style={{fontSize: 16, textAlign: 'center'}}>{item.key}</Text>
</View>
</TouchableHighlight>
}
/>
您可以在Keyboard.dismiss()
组件的onPress
命令中使用console.log('item press')
道具中的TouchableHighlight
功能。