如何在 react 中以不同的路线与 anohter 组件中的动态组件进行交互？

问：

我正在 React 中开发一个共同基金投资组合网站，其中我有一个显示投资组合的组件，称为 .ConventionalPortfolio

App.js 返回：

    <BrowserRouter>
      <Routes>
        <Route path='/' element={<ConventionalPortfolio />

        {Object.keys(funds_urls).map((item, i) => (
          <Route key={i} path={`/${item}`} element={<Individual_fund fund={`${item}`} />} />
        ))}

      </Routes>
    </BrowserRouter>

fund_urls是一个以键作为基金名称的对象，我正在映射到它，并为动态组件制作路由。Individual_fund

中有 2 个日期输入，由状态变量和 处理。还有一个“开始”按钮，单击时由调用并使用这些状态变量的函数处理。Individual_fundstart_dateend_datehandleStart

现在，在组件中，我也有 2 个相同的日期输入和一个“开始”按钮。我希望这个按钮触发状态变量数据从这个组件流到所有这些路由（可以是一条一条的或异步的），进入并填充其日期输入或只是状态变量，然后单击开始按钮，然后将数据带回来。我想处理我从所有路由获得的所有数据（我通过映射键获得的数据。ConventionalPortfolioConventionalPortfolioIndividual_fundfund_url

如何实现此目的？如果您需要更多信息来回答这个问题，请告诉我。