Reactjs 如何在不同的文件或路由之间传递数据？

我是一个新的反应和后，初学者的学习课程反应。我决定做一个个人项目，创建一个月订阅应用程序，帮助我跟踪所有订阅。然而，我被困在一个点上，我需要将一个组件的状态传递到另一个组件，但另一个组件可以通过路由访问，顺便说一句，我使用的是reach路由器。有没有可能的办法。下面是我的代码。所以我想做的基本上是，当我点击列表中的订阅时，（比如说：Netflix），它基本上会占用我另一个页面，并向我显示关于订阅的所有必要细节。在这里，我希望通过state（mylist）

App.js

const-App=（）=>{
返回(
);
};
render（，document.getElementById（“根”））；

List.js

const List=（）=>{
const[mylist，setList]=React.useState（[]）；
const[value，setValue]=React.useState({
认购：“，
起始日期：“，
付款时间：0，
});
常量handleSubmit=（e）=>{
mylist.push（值）；
集合列表（mylist）；
setValue（{订阅：，开始日期：，付款时间：0}）；
e、 预防默认值（）；
};
常量更改=（事件）=>{
setValue（{…value[event.target.name]：event.target.value}）；
};
返回(

{mylist.map（（obj）=>(
// 
{obj.subscription}
/*  */
))}

添加项
);
};
导出默认列表；

Details.js

const细节=（道具）=>{
返回(
不知如何是好(
);
};
导出默认详细信息；

React路由器使用

位置

对象。

位置

对象的属性之一是

状态

。您可以向状态传递一些数据字段，然后在

详细信息

页面中，您将使用这些数据字段获取每个相应订阅的数据

在您的

列表.js中

：

。。。
常量handleSubmit=（e）=>{
e、 预防默认值（）；
mylist.push（值）；
集合列表（mylist）；
setValue（{订阅：，开始日期：，付款时间：0}）；
道具({
路径名：'/details/netflix'，
声明：{
id:“netflix id”，
}
})
};
...
使用路由器导出默认值（列表）；