reactjs - React-admin:如何在 react-admin v3.2.* 中创建用户配置文件表单？

Question

我注意到关于如何在 React-Admin 中创建用户设置(配置文件)的官方文章已经过时(https://marmelab.com/blog/2019/03/07/react-admin-advanced-recipes-user-profile.html)。

我按照示例尝试使用新的 DataProvider，但无法使 Edit View 正常工作(它只显示空白的 Card没有字段的组件，即使我已经按照示例中描述的方式设置它们)。

我搜索了好几天如何以最简单/干净的方式实现它，但有关它的信息非常少。

有人知道如何在 react-admin 3.2.* 中做到这一点吗？

这可能对遇到同样问题的其他人有所帮助。 任何帮助将不胜感激!谢谢!

Answer 1

我遇到了同样的问题。查看传递给 react-admin 的 Edit 的 Prop ，我看到 record Prop 未定义。这是因为数据提供者的 getOne 方法返回的记录中的 id 字段与 Edit 组件上硬编码的 id 属性不同。一旦设置为匹配，阅读/编辑都可以工作。

我的工作代码:

// remove staticContext to avoid React 'unknown prop on DOM element' error
export const PrincipalEdit = ({ staticContext, ...props }: { staticContext: any; props: any }) => {
  return (
    // `id` has to match with `id` field on record returned by data provider's `getOne`
    // `basePath` is used for re - direction
    // but we specify no redirection since there is no list component
      <Edit {...props} title="My Profile" id="my-profile" resource={b.PRINCIPAL} basePath="my-profile" redirect={false}>
        <SimpleForm>
          <TextInput source="firstName" validate={required()} />
        </SimpleForm>
      </Edit>
  );
};