React-Redux: вставка данных в БД - PullRequest
0 голосов
/ 09 апреля 2020

Я учусь использовать response-redux, извините, если я сбиваю с толку!

Я пытаюсь создать форму и вставить данные в БД.

Затем я создал 2 страницы, одну для формы и другую.

RequestForm

handleChange = (e) => {
    let meeting = this.state.meeting;
    meeting[e.target.name] = e.target.value;
    this.setState({ meeting });
  };

  handleSubmit(event) {
    event.preventDefault();
    console.log(this.state.meeting);
    this.props.addMeeting(this.state)
  }

  render() {
    return (
      <form onSubmit={this.handleSubmit}>

        <div>
          <label>Motivation:</label>
          <input
            type="text"
            name="motivation"
            onChange={(event) => this.handleChange(event)}
          />
        </div>
        <div>
          <label>Date:</label>
          <input
            type="date"
            name="date"
            onChange={(event) => this.handleChange(event)}
          />
        </div>

MeetingRequest. js

import RequestForm from './RequestForm';
import { connect } from 'react-redux';
import {addMeeting} from '../Redux/actions';


class MeetingRequest extends Component {

  render() {
    const addMeeting = this.props
    return (
      <div>
        <h2>Request Meeting</h2>
        <RequestForm 
          addMeeting={addMeeting}
        />
      </div>
    );
  }
}

function mapDispatchToProps(dispatch) {
  return {
    addMeeting: (meeting) => dispatch(addMeeting(meeting)),
  };
}

export default connect(null, mapDispatchToProps)(MeetingRequest);

РЕДАКТИРОВАТЬ. Спасибо за комментарии, первая ошибка устранена, теперь у меня проблема 500. Может ли быть проблема с действиями. js ??

А также, по вашему мнению, правильно, как я пытаюсь сделать ??

Спасибо

1 Ответ

1 голос
/ 09 апреля 2020

Изменение:

-const addMeeting = this.props
+const { addMeeting } = this.props

в MeetingRequest.js


Что касается ошибки 500 в API, это может быть связано с тем, что вы отправляете JSON при установке multipart/form-data , Проверьте, используя вкладку Сеть в инструментах разработчика. Если вашему бэкэнду нужно multipart/form-data, вам нужно конвертировать state.meeting объект в FormData

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...