我正在寻找在我的React组件中构建状态的方法，以便我可以一起完成两个目标：（1）在复杂的应用程序中管理浏览器历史记录，以及（2）让各个组件在环境中轻松重用在主应用程序之外。
该应用有一个Panel组件，可让用户浏览和阅读我们网站上的内容。在主应用程序中，可以打开多个面板并将它们排列在一起。在主应用程序之外，还有其他页面，我希望能够轻松放入单个Panel组件。
到目前为止，此代码已经开发，每个Panel都有一个富状态，表示它已加载的内容和其他显示设置。这样可以轻松地放入另一个页面 - 我只需渲染一个Panel组件，用户就可以与它进行交互，它可以自行处理。
然而，对于浏览器历史来说，这是多毛的。有一个App组件可以管理多个Panel以及从历史记录中推送和弹出的状态。为了使其能够全面了解整个应用程序的状态，每个面板在发生更改时都会推送其状态的副本。当从历史记录中弹出状态时，App组件可以从它呈现的每个Panel传递initialState。正如您可以想象的那样，随着更新循环最终循环回到彼此，这会变得混乱且容易出错。
感觉我需要采取的方法是集中国家（建议here）并尝试使每个单独的小组无国籍。由于重写代码中已经setState的所有调用将是一项重大工作，我试图评估这是否是唯一的方法。它也感觉这种方法会使重用应用程序之外的组件变得更加困难。我将失去一种感觉，即Panel是一个独立的组件，我可以在页面上呈现，因为它需要某种外部管理器来处理其状态以及从内部改变它的所有事件
你会推荐什么？
答案 0 :(得分：0)
我在react上创建了一个应用程序并实现了react-router，你可以将URL数据传递给每个面板知道状态是什么以及加载了什么内容，例如你可以有一个url： http://yoururl.com/index/user/userID1/item/itemID2/filterDate?= “19/09/2014”
要重复使用面板，您可以创建一个构成分段路径视图的网址：您可以在要渲染的视图上传递要知道的所有内容。
我的routerDomExample
我建议调查react-router。