从编辑组件访问模型

Question

我有以下编辑组件

const UserEdit = (props) => (
  <Edit {...props}>
    <TabbedForm >
      <FormTab label="User Account">
        <DisabledInput source="id" />
        <TextInput source="email" />
        <TextInput source="password" type="password"/>
        <TextInput source="name" />
        <TextInput source="phone" />
        <SelectInput source="role" optionValue="id" choices={choices} />
      </FormTab>
      <FormTab label="Customer Information">
        <BooleanInput label="New user" source="Customer.is_new" />
        <BooleanInput label="Grandfathered user" source="Customer.grandfathered" />
      </FormTab>
    </TabbedForm >
  </Edit>
);

第二个 FormTab（客户信息）如果用户模型有一些相关信息，我只需要它出现（JSON 类似于）：

{
   id: <int>,
   name: <string>,
   ....
   Customer: {
       is_new: true,
       grandfathered: true,
   }
}

我想知道我是否可以以某种方式访问模型信息（在这种情况下，如果客户键存在并且有信息）以便能够呈现或不呈现 <FormTab label="Customer Information">

我对全局 redux 状态有点迷茫。我知道数据处于状态，因为我已经使用 Redux 工具对其进行了调试。（我试图查看 this.props 但我找不到任何东西来访问全局状态）

谢谢。

Answer 1

如果您在构建表单时需要该对象，您可以connect将其添加到 redux 存储。

import { connect } from 'react-redux';

// this is just a form, note this is not being exported
const UserEditForm = (props) => {
    console.log(props.data); // your object will be in props.data.<id>
    let customFormTab;
    const id = props.params.id;

    if (typeof props.data === 'object' && && props.data.hasOwnProperty(id)) {
        if (props.data[id].something) {
            customFormTab = <FormTab>...;
        }
    }

    return <Edit {...props}>
          <Formtab...
          {customFormTab}
    </Edit>;
}

// this is your exported component
export const UserEdit = connect((state) => ({
    data: state.admin.User.data
}))(UserEditForm);

PS: 我不确定这是否是一个好的或理想的解决方案（希望有人会纠正我，如果我不按照如何做某事redux 或 admin-on-rest 被设计）。

从编辑组件访问模型

Access the model from the Edit component

javascript

admin-on-rest