Mo.*_*Mo. 0 javascript reactjs react-native react-native-ios react-native-flatlist
用户需要在点击两次FlatList项目,因为autoFocus={true}对<TextInput。第一次单击时,键盘处于隐藏状态,然后单击呼叫onPress={this.GetItem.bind(this, item)}。是否可以选择GetItem()单击一次而不是单击两次。
演示:https://snack.expo.io/ByJ_yWehM
export default class App extends Component {
GetItem (item) {
console.log(item);
Alert.alert(item);
}
render() {
return (
<View style={styles.container}>
<TextInput
autoFocus={true}
style={styles.paragraph}
keyboardType='web-search'
>
Change code in the editor and watch it change on your phone!
Save to get a shareable url.
</TextInput>
<Card title="Local Modules">
<View>
<TextInput
style={styles.searchField}
placeholder="Type here to translate!"
onChangeText={(text) => this.setState({text})}
/>
<FlatList
data={["akin","alike","close","comparable","like","similar","uniform","Allied","Analogous","Co-ordinate","Commensurate","akin","alike","close","comparable","like","similar","uniform","Allied","Analogous","Co-ordinate","Commensurate"]}
renderItem={({item}) => (
<Text
style={styles.listField}
onPress={this.GetItem.bind(this, item)}
>{item}</Text>
)}
/>
</View>
</Card>
</View>
);
}
}
Run Code Online (Sandbox Code Playgroud)
该组件的目的是在<FlatList>用户搜索时自动提示<TextInput>
添加keyboardShouldPersistTaps='handled'到您的计算机FlatList中将防止键盘被关闭onPress。
<FlatList
keyboardShouldPersistTaps='handled'
data={["akin","alike","close","comparable","like","similar","uniform","Allied","Analogous","Co-ordinate","Commensurate","akin","alike","close","comparable","like","similar","uniform","Allied","Analogous","Co-ordinate","Commensurate"]}
renderItem={({item}) => (
<Text
onPress={this.GetItem.bind(this, item)}
>{item}</Text>
)}
/>
Run Code Online (Sandbox Code Playgroud)
always也可以作为keyboardShouldPersistTaps价值。
| 归档时间: |
|
| 查看次数: |
994 次 |
| 最近记录: |