React-Redux：在數據庫中插入數據

Question

我正在學習使用 react-redux，如果我弄糊塗了，很抱歉！

我正在嘗試創建一個表單並將數據插入到數據庫中。

然后我創建了 2 頁，一個用於表單，另一個用於表單。

申請表

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>

會議請求.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 問題。 會不會是 Actions.js 的問題？

而且在您看來我的做法是正確的？

謝謝

Answer 1

改變：

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

在MeetingRequest.js中

---

關於 API 上的 500 錯誤，可能是因為您在設置multipart/form-data時發送 JSON 。 使用開發工具中的網絡選項卡進行檢查。 如果您的后端需要multipart/form-data ，您必須將state.meeting object 轉換為FormData