如何分离编辑和更新上下文（admin-on-rest，点符号）

Question

我正在使用 npm 包 admin-on-rest 为我的 elixir/phoenix REST API 后端构建反应后台。

我的问题/:id(show action) returns下面的平JSON结构：

{
  id: 7
  content: "<p> Question content here</p>"
  points: 300
  title: "Question title"
}

我的 update action 期望以下嵌套 JSON 作为更新问题的输入：

{
  id: 7
  question: {
    content: "<p>New question content</p>"
    points: 400
    title: "New question title"
  }
}

我的问题与 admin-on-rest

中使用的点符号有关

如果我使用以下 JS 代码来表示 edit 我后台的操作

export const QuestionEdit = (props) => (
  <Edit title={<QuestionTitle />} {...props}>
    <SimpleForm>
      <DisabledInput source="question.id" />
      <TextInput source="question.title" />
      <LongTextInput source="question.content"/>
      <TextInput source="question.points" />
    </SimpleForm>
  </Edit>
)

然后我在 PUT 请求有效负载中有正确的数据，但是 "edit" 表单输入中没有呈现任何值（参见屏幕截图 1）

如果我使用另一种 JS 代码变体（具有扁平源值）：

export const QuestionEdit = (props) => (
  <Edit title={<QuestionTitle />} {...props}>
    <SimpleForm>
      <DisabledInput source="id" />
      <TextInput source="title" />
      <LongTextInput source="content"/>
      <TextInput source="points" />
    </SimpleForm>
  </Edit>
)

然后 "edit" 表单中的所有先前输入值都正确表示，但我的 update 操作无法解析 PUT 请求负载（参见屏幕截图 2）

假设我不想更改我的后端 API（因为它是由 phoenix 代码生成器自动生成的），我如何编辑我的 JS 代码以实现 2 个目标 - 以前的值应该是正确呈现（编辑页面）并应为 update 操作

提供嵌套 JSON 结构

非常感谢您的关注！

Answer 1

看看使用自定义 action。基本上你的表单是用扁平化的数据呈现的，因此当你使用（id、title 等）时它会正确显示。然后，您需要先转换该数据，然后 PUT 将其发送到您的服务器。

如何分离编辑和更新上下文（admin-on-rest，点符号）

How to separate edit and update contexts (admin-on-rest, dot notation)

javascript

rest

admin-on-rest

elixir