这个Picker库是国内大佬邢文亮造的,我觉得比react-native-community/picker好用多了。
in screen:
const [isPickerShow, setPickerShow] = useState(false);
const showPicker = () => {
Picker.init({
pickerData: [1,2,3,4,5],
selectedValue: 3,
onPickerConfirm: data => {
console.log(data)
hidePicker();
},
onPickerCancel: data => {
console.log(data)
hidePicker();
},
});
Picker.show();
setPickerShow(true);
};
const hidePicker = () => {
Picker.hide();
setPickerShow(false);
};
return(
<View style={styles.container}>
//...
{isPickerShow ? (
<TouchableWithoutFeedback onPress={() => hidePicker()}>
<View style={styles.mask} />
</TouchableWithoutFeedback>
) : null}
</View>
);
style:
import { StyleSheet, Dimensions } from 'react-native';
const { width, height } = Dimensions.get('window');
mask: {
width,
height,
position: 'absolute',
zIndex: 1,
},
其它解决方案,比如用Modal,可以参照这里的解决方案 What happened to showMask? #162