ionic-team / ionic-team/ionic-framework

bug: Ionic 8 React - Modals cannot consume context data

未关闭
#29,796 3 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看
triage
主要语言
TypeScript
星标
52.7k
派生
13.3k
平均合并
1 天 15 小时
30 天内合并 PR
51

描述

### Prerequisites

- [X] I have read the [Contributing Guidelines](https://github.com/ionic-team/ionic-framework/blob/main/docs/CONTRIBUTING.md#creating-an-issue).
- [X] I agree to follow the [Code of Conduct](https://ionicframework.com/code-of-conduct).
- [X] I have searched for [existing issues](https://github.com/ionic-team/ionic-framework/issues) that already report this problem, without success.

### Ionic Framework Version

v8.x

### Current Behavior

Modals are unable to consume data using React's context provider. All values provided by context are `undefined`.

### Expected Behavior

Receive provided context data in modals

### Steps to Reproduce

1. Create React context
2. Open modal
3. Consume context

### Code Reproduction URL

https://github.com/playaz87/ionic-7-modal-context

### Ionic Info

Ionic:

Ionic CLI : 7.2.0
Ionic Framework : @ionic/react 8.2.5

Capacitor:

Capacitor CLI : 6.1.1
@capacitor/android : not installed
@capacitor/core : 6.1.1
@capacitor/ios : 6.1.1

Utility:

cordova-res : not installed globally
native-run : 2.0.1

System:

NodeJS : v18.18.0
npm : 9.8.1
OS : macOS Unknown

### Additional Information

So basically this issue is the same as this one: https://github.com/ionic-team/ionic-framework/issues/27546
However the suggested solution is not good for every scenario.

In my case the context provider can't be above the `IonApp` component since it is only exist deeper in the tree.

I think ionic should provide a way to overcome it. A solution that might work pretty good is like [antd](https://ant.design/) [useModal](https://ant.design/components/modal#modal-demo-hooks) hook. This hook provide a contextHolder which you put within your jsx (which than will be mounted there) and by that you can access the context.

贡献指南

打开贡献指南

评估

这个 Issue 还没有评估数据。

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。