Reactjs React admin：如何在React admin v3.2*中创建用户配置文件表单？

我注意到关于如何在React Admin中创建用户设置（profile）的官方文章已经过时（）

我遵循这个示例，尝试使用一个新的

数据提供程序

，但无法让

编辑

视图工作（它只是显示了空白的

卡

组件，没有字段，即使我已经按照示例中描述的方式设置了字段）

我花了几天的时间研究如何以最简单/干净的方式实现它，但是关于它的信息非常少

有人知道如何在react admin 3.2.*中实现吗

这可能对其他有同样问题的人有所帮助。

---

任何帮助都将不胜感激！谢谢

我也有同样的问题。查看传递给Act管理员的

编辑的道具，我看到
记录
道具未定义。这是因为数据提供程序的
getOne
方法返回的记录中的
id
字段与编辑组件上硬编码的
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>
  );
};


//删除staticContext以避免出现“DOM元素上的未知属性”错误
export const PrincipalEdit=（{staticContext，…props}:{staticContext:any；props:any}）=>{
返回(
//`id`必须与数据提供程序的`getOne'返回的记录上的`id`字段匹配`
//'basePath'用于重定向
//但是我们没有指定重定向，因为没有列表组件
);
};
问题在于，
react admin
目前是如何存储数据的（之前没有检查数据是如何存储的）。现在，每个数据条目都通过其id保存在store对象中（原因很明显）。我认为最好的方法是修改数据提供者

if (resource === 'profile') {
  const { id, ...p } = params; // removes the id from the params
  if (p.data)
    delete p.data.id; // when updates there is data object that is passed to the backend

  return dataProvider(type, resource, { ...p, id: '' }) // set the id just empty string to hack undefined as http param
    .then(({ data }) => {
      return Promise.resolve({
        data: {
        ...data,
          id // return the data with the initial id
        }
      });
    });
}

这样，后端端点可以只返回实体
/profile
的主端点处的对象。如果未将id属性设置为
'
，它将尝试获取
/profile/undefined
，因为id属性已从
参数
对象中删除。如果在更新时未从数据对象中删除id属性，则根据更新记录的后端sql查询（假设您使用某种db），它可能会尝试根据此id进行设置或搜索

在
Edit
组件中，您可以传递所需的任何id，但必须传递某些内容

附加：
如果您使用NestJS作为Crud包的后端，这些
@Crud
参数可能会有所帮助

  ...
  params: {
    id: { // the routes won't have params, very helpful for me/profile controller
      primary: true,
      disabled: true,
    },
  },
  routes: {
    only: ["getOneBase", "updateOneBase"],
  },
  ...