Stack Overflow на русском Asked by dmitriy on January 10, 2021
У меня есть компонент FormBox.js
import PropTypes from 'prop-types';
const FormBox = (props) => {
return <form className={`shadow p-3 ${props.className}`}>{props.children}</form>;
};
FormBox.propTypes = {
children: PropTypes.node,
className: PropTypes.string,
};
export default FormBox;
в App.js у меня происходит отправка формы но не срабатывает event.preventDefault(). Я так понимаю что это из за того что это форма у меня компонент. Как можно предотвратить отправку формы?
class App extends React.Component {
constructor(props) {
super(props);
this.state = {
posts: [],
post: {
title: '',
body: '',
},
};
this.handleChange = this.handleChange.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
}
async handleSubmit(event) {
event.preventDefault();
const response = await postApi.addPost(this.state.post);
console.log(response);
}
render() {
return (
<div className="container">
<FormBox onSubmit={this.handleSubmit} className="mt-4">
<Button className="btn-info" type="submit" />
</FormBox>
</div>
);
}
}
export default App;
import React from 'react';
import PropTypes from 'prop-types';
const FormBox = (props) => {
return <form onSubmit={props.onSubmit} className={`shadow p-3 ${props.className}`}>{props.children}</form>;
};
FormBox.propTypes = {
children: PropTypes.node,
className: PropTypes.string,
};
export default FormBox;
Correct answer by Евгений Платов on January 10, 2021
Get help from others!
Recent Answers
Recent Questions
© 2024 TransWikia.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP