Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bug] Toast does not show on modal on react native 0.75.3 #1388

Open
1 task done
arlovip opened this issue Oct 24, 2024 · 3 comments
Open
1 task done

[Bug] Toast does not show on modal on react native 0.75.3 #1388

arlovip opened this issue Oct 24, 2024 · 3 comments
Labels

Comments

@arlovip
Copy link

arlovip commented Oct 24, 2024

💬 前提强调

  • I have searched the issues of this repository and believe that this is not a duplicate.

🙋 描述详情/重现步骤

依赖版本:"@ant-design/react-native": "^5.2.3"
不使用ModalToast正常显示,使用Modal,无法显示。

代码很简单:

import {Button, Modal, View} from "react-native";
import {Toast, Provider} from "@ant-design/react-native";
import {useState} from "react";

export default function ProfilePage(props) {
	const [visible, setVisible] = useState(false);
	return (
		<View style={{flex: 1, paddingTop: 100}}>
			<Button title={"Show Toast"} onPress={() => {
				// 这里正常
				Toast.show("Hello world", 2, false);
			}}/>
			<Button title={"Show Modal"} onPress={() => setVisible(true)}/>
			<Modal visible={visible}>
				<Provider>
					<View style={{height: 400, backgroundColor: "blue"}}>
						<Button title={"Show Toast on Modal"} onPress={() => {
							// 这里Toast不显示???
							Toast.show("Hi, show on modal?", 2, false);
						}}/>
						<Button title={"Close Modal"} onPress={() => setVisible(false)}/>
					</View>
				</Provider>
			</Modal>
		</View>
	);
}

🔴 版本

10.7.0

💻 运行环境

Android

⚫️ npx react-native info输出信息

System:
  OS: macOS 14.3.1
  CPU: (8) arm64 Apple M2
  Memory: 89.28 MB / 16.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 22.1.0
    path: ~/.nvm/versions/node/v22.1.0/bin/node
  Yarn:
    version: 1.22.19
    path: /opt/homebrew/bin/yarn
  npm:
    version: 10.7.0
    path: ~/.nvm/versions/node/v22.1.0/bin/npm
  Watchman: Not Found
Managers:
  CocoaPods:
    version: 1.15.2
    path: /opt/homebrew/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 23.5
      - iOS 17.5
      - macOS 14.5
      - tvOS 17.5
      - visionOS 1.2
      - watchOS 10.5
  Android SDK: Not Found
IDEs:
  Android Studio: 2024.1 AI-241.18034.62.2412.12266719
  Xcode:
    version: 15.4/15F31d
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.10
    path: /usr/bin/javac
  Ruby:
    version: 2.7.5
    path: /Users/chenlong/.rbenv/shims/ruby
npmPackages:
  "@react-native-community/cli": Not Found
  react:
    installed: 18.3.1
    wanted: 18.3.1
  react-native:
    installed: 0.75.3
    wanted: 0.75.3
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: false
iOS:
  hermesEnabled: true
  newArchEnabled: false

补充说明

No response

@LeeYuze
Copy link

LeeYuze commented Oct 24, 2024

不能使用ReactNative的Modal,你要用Ant Design的Modal,因为原生的Modal层级比较高覆盖不了

@arlovip
Copy link
Author

arlovip commented Oct 24, 2024

@LeeYuze 那为啥之前的RN版本就可以呢?之前一直这么用啊,现在升级了RN,就不显示了,有点难受

@arlovip
Copy link
Author

arlovip commented Oct 24, 2024

有其他办法吗?因为我全局用的基本都是react-native-modal或者RN自带的Modal,如果替换成Ant DesignModal,因为属性配置和动画效果差异,替换成本比较大,这样比较麻烦

1uokun added a commit that referenced this issue Oct 28, 2024
1uokun added a commit that referenced this issue Oct 28, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants