ant-design / ant-design-mobile-rn

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

[Bug] Modal组件中使用react-navigation中 useRoute会报错 #1383

Open 7pou opened 1 week ago

7pou commented 1 week ago

💬 前提强调

🙋 描述详情/重现步骤

import { useRoute} from '@react-navigation/native';
const route = useRoute()
<Modal popup>
{children}
</Modal>

看源码Modal会被Portal挂在Navigate外面, 有什么解决方案吗

🔴 版本

5.0.4

💻 运行环境

Android

⚫️ npx react-native info输出信息

System: OS: Windows 10 10.0.19044 CPU: (4) x64 Intel(R) Core(TM) i5-6402P CPU @ 2.80GHz Memory: 10.45 GB / 27.92 GB Binaries: Node: version: 18.20.3 path: C:\Program Files\nodejs\node.EXE Yarn: version: 1.22.15 path: ~\AppData\Roaming\npm\yarn.CMD npm: version: 10.7.0 path: C:\Program Files\nodejs\npm.CMD Watchman: Not Found SDKs: Android SDK: Not Found Windows SDK: Not Found IDEs: Android Studio: AI-233.14808.21.2331.11709847 Visual Studio: Not Found Languages: Java: version: 17.0.11 path: /c/Program Files/Common Files/Oracle/Java/javapath/javac Ruby: Not Found npmPackages: "@react-native-community/cli": Not Found react: installed: 18.2.0 wanted: 18.2.0 react-native: installed: 0.72.3 wanted: 0.72.3 react-native-windows: Not Found npmGlobalPackages: "react-native": Not Found Android: hermesEnabled: true newArchEnabled: false iOS: hermesEnabled: Not found newArchEnabled: Not found

补充说明

目前的层级是 AntProvide -> NavigationContainer -> Stack.Navigator -> Stack.Screen -> Modal 我尝试修改为 NavigationContainer -> AntProvide -> Stack.Navigator -> Stack.Screen -> Modal后没有解决问题

No response

1uokun commented 1 week ago

未来版本会参考https://ant.design/components/modal-cn#modalusemodal 加入 useModal(),把Modal可以得到当前page页的上下文,而不是只能root Portal中


In future versions, we will refer to https://ant.design/components/modal-cn#modalusemodal to add useModal, so that Modal can get the context of the current page instead of the root Portal.