import {Button, Modal, View} from "react-native";
import {useState} from "react";
import {RootSiblingParent} from "react-native-root-siblings";
import Toast from "react-native-root-toast";
export default function ProfilePage(props) {
const [visible, setVisible] = useState(false);
return (
<View style={{flex: 1, paddingTop: 100}}>
<Button title={"Show Toast"} onPress={() => {
// This works well!
Toast.show("Hello, world", {
duration: 2000,
position: Toast.positions.CENTER,
});
}}/>
<Button title={"Show Modal"} onPress={() => setVisible(true)}/>
<Modal visible={visible}>
<RootSiblingParent>
<View style={{flex: 1, backgroundColor: "red", paddingTop: 300}}>
<Button title={"Show Toast on Modal"} onPress={() => {
// This does not work on modal???
Toast.show("Hi, how are you?", {
duration: 2000,
position: Toast.positions.CENTER,
});
}}/>
<Button title={"Close Modal"} onPress={() => setVisible(false)}/>
</View>
</RootSiblingParent>
</Modal>
</View>
);
}
As descriped, Toast does not show on Modal on react native
0.75.3.It works well without
Modal.Code snippets: