按钮单击时反映渲染不同的子组件

Question

chatbox

profile view

所以这些是我的社交网络项目的模型。 我的问题是，当用户登录时，他会看到此视图。 有两个父组件THE LEFT PANE和RIGHT PANE。 LEFT PANE在整个会议期间仍然存在。但是在右侧窗格中我必须渲染

• 聊天框（当有人点击列表中的朋友时）。
• 待处理请求组件（当看到待处理请求按钮时） 点击）
• 搜索朋友（点击制作朋友按钮时）
• 个人资料视图（当有人点击交互式按钮
时）

优先事项：

• 我不想在任何地址栏中显示更改 组件变化。所以不能使用浏览器路由器。

可能的解决方案，但有疑问

• 我可以通过附加一些状态变量来使用条件渲染    单击每个按钮，单击该按钮确定    我应该呈现该特定组件的状态。

• 我可以在反应路由器中使用内存路由器来保存代码 清理并且不要在地址栏中显示更改。

帮助 任何有经验的人都可以告诉我这是否还有其他办法？如果不是这两个之间更好的选择？

请参考图片以全面了解情况。

感谢。

P.S。我只能在待处理请求的另外两个组件上发布两个链接，并且可以在右侧窗格中以相同的方式加载朋友。

Answer 1

我认为最好的方法是使用内存路由器，因为它有助于保持代码整洁，并且可以理解可重用性