callstack / callstack/react-native-paper
Nested component in Portal not receiving state values of React Context
- 主要语言
- TypeScript
- 星标
- 14.5k
- 派生
- 2.2k
- 平均合并
- 5 天 23 小时
- 30 天内合并 PR
- 12
描述
### Current behaviour
When using Portal component you are not given the context of the state in the wrapping/global React Context Provider
### Expected behaviour
You should be able to access the state values of the Context Provider
### How to reproduce?
- create a new expo app
- install react-native-paper
- create a context using createContext from react and give it an initial state/default value
- wrap the entire app in your named context.Provider
- create any component (text, view, snackbar etc.)
- using the Portal component wrap the created component
- inside the created component call the useContext() with your created context as the parameter
- expect the state to be defined/a value, but it is undefined
https://snack.expo.dev/184285Vsi - here is a simple snack to what the issue is, with some logs
### Preview
The Context and Provider

Main App wrapped in Provider

Portal Component

nested component of Portal

Log of initial values outside of Portal

We expect these values to be the same within the portal
However as seen the in screenshot of the logs below it is undefined:

### What have you tried so far?
To fix this I have passed in the state values as props to the nested component - this seems to work, however it is defeating the purpose of using Context Providers of react
### Your Environment
| software | version
| ----------------------- | -------
| react-native | 0.71.7
| react-native-paper | ^5.7.0
| node | 16.19.0
| npm | 8.19.3
| expo sdk | ^48.0.11
贡献指南
调研方向
首先在链接的 Expo Snack 中复现该行为,然后阅读 Portal 组件的入口点,并跟踪其嵌套内容是如何渲染的。确认 context 值是否仅在 Portal 内容内部不可用。完成的标准是嵌套组件接收到与 Portal 外部组件相同的 context 状态,并且针对所报告设置具备回归覆盖。
由索引模型根据 Issue 内容生成。
评估
- 技术栈
- react-native, typescript
- 领域
- mobile
- Issue 类型
- 缺陷
- 难度
- 3/5
- 预计耗时
- 1-2 天
- 活跃度
- 停滞
- 描述清晰度
- 基本清楚
- 新手友好度
- 35/100