Ошибка синтаксического анализа многоэлементной формы - недопустимая граница в многоэлементной структуре - PullRequest
0 голосов
/ 25 марта 2020

Я работаю над простым CRUD с реагировать и реагировать на избыточность и у меня проблемы с POST на стороне клиента BoardList. js

import React, { Component, Fragment } from 'react';
import { connect } from 'react-redux';
import PropTypes from 'prop-types';
import { getBoards, deleteBoard, addBoard } from "../../actions/boards"

export class BoardList extends Component {
    static propTypes = {
        boards: PropTypes.array.isRequired,
        getBoards: PropTypes.func.isRequired,
        deleteBoard: PropTypes.func.isRequired,
        addBoard: PropTypes.func.isRequired
    }
    componentDidMount() {
        this.props.getBoards();
    }
    shouldComponentUpdate(nextProps, nextState){
        return this.props.boards !== nextProps.boards
    }
    render(){
        return (
            <Fragment>
                <h2>Boards</h2>
                <table className="table table-striped">
                    <thead>
                        <tr>
                            <th>ID</th>
                            <th>Author</th>
                            <th>Title</th>
                            <th>Created</th>
                            <th>Updated</th>
                            <th />
                        </tr>
                    </thead>
                    <tbody>
                        {this.props.boards.length > 0 && this.props.boards.map(board => (
                            <tr key={board.id}> 
                             // Uncaught TypeError: Cannot read property 'id' of undefined
                                <td>{board.id}</td>
                                <td>{board.author}</td>
                                <td>{board.title}</td>
                                <td>{board.created}</td>
                                <td>{board.updated}</td>
                                <td>
                                    <button 
                                      className="btn btn-danger btn-sm"
                                      onClick={this.props.deleteBoard.bind(this, board.id)}
                                      >
                                      Delete</button>
                                </td>
                            </tr>
                        ))}
                    </tbody>
                </table>
            </Fragment>
        )
    }
}

const mapStateToProps = state => ({
    boards: state.boards.boards,
})

export default connect(mapStateToProps, {getBoards, deleteBoard, addBoard})(BoardList)

редукторы / доски. js

import { GET_BOARDS, DELETE_BOARD, ADD_BOARD } from "../actions/types.js";

const initialState = {
    boards : []
}

export default function(state=initialState, action) {
    switch (action.type) {
        case GET_BOARDS:
            return {
                ...state,
                boards: action.payload
            }
        case DELETE_BOARD:
            return {
                ...state,
                boards:state.boards.filter(board => board.id !== action.payload)
            }
        case ADD_BOARD:
            return {
                ...state,
                boards:[...state.boards, action.payload]
            }
        default:
            return state;
    }
}

действия / доски. js


export const addBoard = board => (dispatch, getState) => {
    const token = getState().users.token;
    const config = {
        headers: {
            'Content-Type': undefined   //I suspect this is wrong
        }
    if(token){
        config.headers["Authroization"] = `Token ${token}`
    }
    axios
      .post("api/boards/",board, tokenConfig(getState))
      .then(res=> {
          dispatch(createMessage({ addBoard: "Board added"}));
          dispatch({
              type:ADD_BOARD,
              payload: res.data
          })
      })
      .catch(err => dispatch(returnErrors(err.response.data, err.response.status)));
}

enter image description here Я знаю, что это сообщение об ошибке относится к django rest framework, однако я могу отправить его через Почтальон. Поэтому я думаю, что это моя проблема Content-Type. (Если я ошибаюсь, пожалуйста, исправьте меня) В первый раз я подумал, что django pass framework pass json, поэтому я использовал application/json. затем я получил The submitted data was not a file. Check the encoding type on the form. Я также использовал multipart/form-data и undefined тогда я получаю Multipart form parse error - Invalid boundary in multipart: None ошибку. Как я могу справиться с этой проблемой?

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