Javascript 跨文件使用上下文会导致循环依赖

我有一个由两个组件组成的父级和子级，我想将上下文从父级导出到子级，但这会导致循环依赖

例如，将Parent.js视为

从'/Child.js'导入{Child}；
export const MyContext=React.createContext（）；
常量父项=（）=>{
返回；
}

而Child.js作为

从'Parent'导入{MyContext}；
常量Child=（）=>{
const myContext=useContext（myContext）；
返回{myContext}；
}

我可以将其作为道具传递，但如果有多个嵌套级别，这将很困难。我能想到的一个可能的解决方案是使用另一个名为

contexts.js的文件，并从那里导出我的所有上下文

有更好的方法吗？
将您的上下文放在它自己的文件中，例如
context.js
。然后，
Parent.js
和
Child.js
都可以导入它。
通常，您不需要将子项作为父项的依赖项，而是通过使用将上下文提供程序组件与其子项松散耦合

Parent.js
：

export const MyContext=React.createContext（）；
常量父项=（{children}）=>{
返回{children}；
};
导出默认父对象；

Child.js
：

从“/Parent”导入{MyContext}；
常量Child=（）=>{
const myContext=useContext（myContext）；
返回{myContext}；
};
导出默认子对象；

然后在创建虚拟DOM时，使用
填充
props.children
：

从“/Parent”导入父项；
从“./Child”导入子项；
常量应用=（）=>{
返回；
};
...
是的，正如我提到的，我就是这么想的。我只是想看看是否有一种更好的开发人员通常使用的方法，因为这可能是许多人应该遇到的情况。