react-native-dropdownalert
Table of contents
- Support
- Installation
- Demo
- Usage
- Props
- Caveats
An alert to notify users about new chat messages, something went wrong or everything is okay. It can be closed by tap, cancel button, automatically with closeInterval
, pan responder up gesture or programmatically (this.dropDownAlertRef.closeAction()
).
Support
react-native version | package version | reason |
---|
0.50.0 | >=3.2.0 | Included SafeAreaView (iPhone X) |
0.44.0 | >=2.12.0 | Adopted ViewPropTypes |
Installation
npm i react-native-dropdownalert --save
yarn add react-native-dropdownalert
Demo
Usage
import DropdownAlert from 'react-native-dropdownalert';
export default class App extends Component {
componentDidMount() {
this._fetchData();
}
_fetchData = async () => {
try {
this.dropDownAlertRef.alertWithType('info', 'Info', 'Start fetch data.');
await fetch('https://httpbin.org/get');
this.dropDownAlertRef.alertWithType('success', 'Success', 'Finish fetch data');
} catch (error) {
this.dropDownAlertRef.alertWithType('error', 'Error', error);
}
};
render() {
return (
<View>
<DropdownAlert ref={ref => this.dropDownAlertRef = ref} />
</View>
);
}
}
Caveats
- Modals can overlap DropdownAlert if it is not inside the modal's document tree.
- It is important you place the
DropdownAlert
ABOVE the StackNavigator
.
Inspired by: RKDropdownAlert