ant-design / ant-design-mobile-rn

Ant Design for React Native
https://rn.mobile.ant.design/
MIT License
3.07k stars 611 forks source link

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

Open arlovip opened 1 day ago

arlovip commented 1 day ago

💬 前提强调

🙋 描述详情/重现步骤

依赖版本:"@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 commented 1 day ago

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

arlovip commented 1 day ago

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

arlovip commented 1 day ago

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