React Admin：创建/编辑视图中的动态SuccessMessage

Question

我正在使用react-admin框架，并尝试根据父视图successMessage中子输入的值从Create/Edit视图发送动态SimpleForm。

现在GetSuccessMsg()在渲染时被调用一次，并且仅将初始值传递到通知面板。这是我当前的代码。

export const UserCreation = ({ userId, timezone, ...props }) => {
  var SuccessMsg = "Account Created. Email sent to complete account setup."
  const ValidateUserCreation = (values) => {
    SuccessMsg = values 
      ? "Account Created. Email sent to complete account setup." 
      : "Account Created"
    return undefined
  };

  const GetSuccessMsg = () => { return SuccessMsg }

  return (
    <Create {...props} successMessage={GetSuccessMsg()}>
      <SimpleForm toolbar={<WithPracticeToolbar many />}>
        <TextInput source="name" />
        <TextInput source="phone" />
        <TextInput source="email" />
        <TimezoneDropDown source="timezone" />
        <BooleanInput
          validate={ValidateUserCreation}
          label="Create login account for this member"
          source="createMemberLogin"
          defaultValue
        />
      </SimpleForm>
     </Create>
   )
};

我正在寻找更改子输入时更新successMessage道具（传递给Create）的任何合理方法。

提前感谢您的帮助！

Answer 1

您可以尝试做类似这样的事情。另外，您可以在https://marmelab.com/react-admin/Inputs.html

中找到详细信息

import { useForm } from 'react-final-form';

export const UserCreation = ({ userId, timezone, ...props }) => {

var SuccessMsg = "Account Created. Email sent to complete account setup."

const ValidateUserCreation = ({ formData, ...rest }) => {
    // here think you will hava acces to the formData values
    SuccessMsg = formData ? `Account Created. Email sent to ${formData.email} to complete account setup.` : "Account Created"
    return undefined
};

const GetSuccessMsg = () =>{
    return SuccessMsg 
}

return (
  <Create {...props} successMessage={GetSuccessMsg()}>
    <SimpleForm toolbar={<WithPracticeToolbar many />}>
      <FormDataConsumer>
        <TextInput source="name" />
        <TextInput source="phone" />
        <TextInput source="email" />
        <TimezoneDropDown source="timezone" />
        {formDataProps => (
          <BooleanInput
            validate={ValidateUserCreation(formDataProps)}
            label="Create login account for this member"
            source="createMemberLogin"
            defaultValue/>
         )}

      <FormDataConsumer>
    </SimpleForm>
  </Create>
)
};