是否可以在其他上下文中使用带有响应(钩子)的上下文?

Oemera

当我有两个上下文时,其中一个在另一个上下文中:

  ...
    <ContextOne.Provider value={valueOne}>
      <ContextTwo.Provider value={valueTwo}>
        {children}
      </ContextTwo.Provider>
    </ContextOne.Provider>
  ...

难道ContextTwo现在使用ContextOne

// ContextTwo.jsx
...
const contextOne = useContext(ContextOne);
console.log(contextOne.valueOne); // returns undefined
...

基本上,ContextOne转换valueOne为状态(useState),并且ContexTwo需要使用该状态。就我而言,的值contextOne在某种程度上是不确定的,而根本没有异步操作。我以为这是可能的,因为ContextTwo.Provider在里面ContextOne.Provider

在这一点上,我真的不知道这是不可能的还是我的代码总体上有问题。

丹尼斯瓦什

是的,有可能,您需要useContextContextTwo包装器,例如:

const ContextOne = createContext();
const ContextTwoInner = createContext();

const ContextTwo = ({ value, children }) => {
  const valueOne = useContext(ContextOne);
  console.log(valueOne);

  return (
    <ContextTwoInner.Provider value={value}>
      {children}
    </ContextTwoInner.Provider>
  );
};

// For OP's code to work
ContextTwo.Provider = ContextTwo;


// Logs valueOne
const App = () => {
  return (
    <ContextOne.Provider value={valueOne}>
      <ContextTwo.Provider value={valueTwo}>
        <div>Hello</div>
      </ContextTwo.Provider>
    </ContextOne.Provider>
  );
};

编辑fancy-cherry-cy3mq

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

Python exec() 在其他上下文中

在其他窗口的上下文中执行功能?

是否可以在运行时在其他上下文中创建新的词汇符号?

如何允许根上下文中的servlet过滤器在其他上下文中工作?

如何在静态上下文中使用带有上下文参数的类而不引起内存泄漏?

DDD - 验证实体在其他有界上下文中的存在

单击:在带有上下文对象的链接命令中使用其他功能

如何在C#中使用其他上下文中的变量

如何在其他类Android Kotlin中使用它和上下文?

是否可以在小部件中使用上下文?

在其他应用程序的上下文中运行命令

使用上下文存储JSX组件以在其他地方显示是否滥用上下文?

在其他位置显示上下文操作栏

如何在 MERN 堆栈应用程序中使用钩子更新上下文中的状态

是否可以在GWT UiBinder上下文中引用枚举

在带有响应钩子的上下文提供程序中添加多个状态

我可以从消息上下文中获得什么其他对象

使用grepl匹配某些单词,但只能在不得出现其他单词的特定上下文中使用

正确响应来自其他上下文的等待条件

如何在特定上下文中使用querySelectorAll

在上下文中使用数据构造函数

无法在IO上下文中使用状态monad

如何在测试上下文中使用 LocalizationUtility

在继承上下文中使用base

此:不能在静态上下文中使用

在通用上下文中使用getActualTypeArguments

在静态上下文中使用泛型类型

在OR上下文中使用多个Laravel范围

在单值上下文中使用多值