Мы используем react-admin response-admin docs
У меня есть форма с полями productName, Price and Image. Поле изображения имеет строковый тип, что означает загрузку изображения в s3 или любое другое место назначения и динамическую передачу URL загруженного изображения в поле изображения.
У меня работает функция загрузки изображения в s3, и я получаю URL-адрес s3, теперь пользователь заполнит поля ProductName and Price и нажмет "Отправить". и когда форма отправляется, я хочу передать URL-адрес изображения также с другими полями.
Выше приведены мои требования, которых я хочу достичь. Позвольте мне объяснить вам, что я пробовал.
Я перехожу по этой ссылке по ссылке.
ProductCreate.js
export class ProductCreate extends Component{
render(){
return (
<Create {...this.props}>
<SimpleForm toolbar={<PostCreateToolbar />} redirect="show">
<TextInput source="name" />
<TextInput source="price"/>
</SimpleForm>
</Create>
)
}
}
В приведенном выше коде вы можете видеть, что я использовал toolbar реквизиты на SimpleForm с настраиваемой панелью инструментов под названием PostCreateToolbar.
PostCreateToolbar.js
const PostCreateToolbar = props => (
<Toolbar {...props}>
<SaveWithNoteButtonView
label="Save"
redirect="show"
submitOnEnter={false}
variant="contained"
/>
</Toolbar>
);
SaveWithNoteButtonView.js
class SaveWithNoteButtonView extends Component {
handleClick = () => {
const { basePath, handleSubmit, redirect } = this.props;
const form = useForm();
console.log("123", this.props);
return handleSubmit(values => {
console.log("456", this.props);
crudCreate('posts', { ...values, imageUrl: "https://s3.us-east-1.amazonaws.com/..." }, basePath, redirectTo);
});
};
render() {
const { handleSubmitWithRedirect, saveWithNote, ...props } = this.props;
return (
<SaveButton
handleSubmitWithRedirect={this.handleClick}
{...props}
/>
);
}
}
В файле SaveWithNoteButtonView вы можете увидеть, что у меня есть функция handleClick, и когда пользователь нажимает кнопку сохранения, эта функция будет вызываться, но handleSubmit не вызывается. Когда пользователь нажимает кнопку сохранения, я вижу первую консоль, но не вторую, которая находится в пределах handleSubmit. Может быть, это проблема, когда происходит вызов API, я не могу отправить поле imageUrl.
У кого-нибудь есть другой способ передать пользовательские данные перед отправкой. Я открыт, чтобы получить представление.
Еще один способ, как я думал, - в форме продукта я могу отключить поле imageURL, и когда изображение загружается в s3 и получает URL-адрес, затем каким-то образом заполняет поле imageURL значением imageURL. поэтому, когда мы отправляем форму, значение поля imageURL передается в api. Если вы знаете, как этого добиться, это было бы полезно.
