如何在 react-admin 中禁用乐观 UI 更新？

Posted 2023-02-22

【中文标题】如何在 react-admin 中禁用乐观 UI 更新？

【英文标题】：How to disable optimistic UI updates in react-admin?

【发布时间】：2018-11-21 07:43:02

【问题描述】：

是否可以在 react-admin 中禁用乐观 UI，或者是否可以在运行时配置？

【参考方案1】：

在 Edit 组件中禁用 undoable 属性：

<Edit undoable=false title=<EditTitle /> actions=<EditActions /> ...props>

【讨论】：

有没有办法为全球所有表单设置undoable=false？谢谢

根据Edit组件创建自己的组件，默认设置undoable属性为false

是的，我认为我希望我可以在

中传递 undoable=false

如果你想让你的 undoable 总是为 false，创建一个 Edit 组件，将 undoable props 设置为 false，而不是一直从 react-admin 导入 Edit 组件，你导入你的新创建的编辑组件。

我也想关闭 Show 页面的优化渲染，但传递 undoable=false 不起作用。

【参考方案2】：

如您所知，undoable 不能在 Create 组件上设置。如果您的 props 与 Create 页面不同，这是一种处理乐观渲染的方法，而不是禁用它。

这是在<Show/> 上处理乐观渲染的示例：

const ItemShow = (props) => 
  const record = props;
  return (
    <Show
      ...props
    >
      <ItemCreatedScreen />
    </Show>
  );
;

const ItemCreatedScreen = ( record ) => 
  if (record.isFromCreatePage) 
    return <Loading />;
   else 
    return <ItemView record=record />;
  
;

Create 组件表单中的自定义道具 isFromCreatePage 应该可以帮助您确定该道具是否确实来自“创建”页面。

Optimistic Rendering 会在几秒钟后将请求发送到 API，同时 UI 可以显示 <Loading/> 符号，我可能会添加很短的持续时间。之后，请求从服务器获取数据，然后可以将其传递到<ItemView/> 页面。