22、React 应用中的状态管理与优化

React 应用中的状态管理与优化

在开发 React 应用时，数据的共享和状态管理是至关重要的环节。传统的数据传递方式在组件层级较深时会变得复杂且容易出错，而使用全局数据存储和上下文（Context）可以有效简化这一过程。

数据更新与显示

当有新数据可用时，我们可以在绘制每个音乐会的部分文件中更新显示。关键代码位于 turbo_frame_tag 声明之后：

chapter_10/05/app/views/concerts/_concert.html.erb
<% if current_user.editing?(concert) %>
  <%= render "concerts/form", concert: concert %>
<% else %>
  <!-- 之前部分的内容（article 标签） -->
<% end %>

这里的逻辑是，当应用绘制单个音乐会时（通常是在渲染整个页面时），会检查 editing? 方法，该方法会与 Kredis 进行交互，并根据返回值绘制表单或显示版本。不过，当前代码存在问题，表单部分会重复 turbo_frame_tag ，因此需要将标签创建移至编辑页面。

Kredis 是使用 Redis 管理临时数据的便捷方式，但它是服务器端的数据存储，客户端的更改仍需与服务器通信以更新和引用值。例如，收藏部分的显示 - 隐藏切换功能若要在会话间持久化状态，就需要向服务器发送通知。 <