Skip to content

Toast does not show on Modal on react native 0.75.3 #181

Open
@arlovip

Description

@arlovip

As descriped, Toast does not show on Modal on react native 0.75.3.

It works well without Modal.

Code snippets:

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>
	);
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions