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

【问题标题】：How to disable optimistic UI updates in react-admin?如何在 react-admin 中禁用乐观 UI 更新？
【发布时间】：2018-11-21 07:43:02
【问题描述】：

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

【问题讨论】：

标签： react-admin

【解决方案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/> 页面。

【讨论】：