首页 > 解决方案 > 未处理的拒绝(TypeError):尝试执行 POST 请求后无法读取未定义的属性“推送”

问题描述

尝试发布时在浏览器中弹出此错误:最新错误:

TypeError:无法在 SandwhichForm.js:30 在异步 SandwhichForm.handleFormSubmit (SandwhichForm.js:27) 处读取未定义的属性“推送”

这是完整的代码:


    import React from 'react';
    import { Form, Input, Button } from 'antd';
    import { connect } from "react-redux";
    import axios from 'axios';

    const FormItem = Form.Item;


    class SandwhichForm extends React.Component {

        handleFormSubmit = async (event, requestType, sandwhichID) => {
            event.preventDefault();

            const postObj = {
                title: event.target.elements.title.value,
                content: event.target.elements.content.value
            }   

        axios.defaults.xsrfHeaderName = "X-CSRFTOKEN";
        axios.defaults.xsrfCookieName = "csrftoken";
        axios.defaults.headers = {
            "Content-Type": "application/json",
            Authorization: `Token ${this.props.token}`,
        };

        if (requestType === "post") {
            await axios.post('http://127.0.0.1:8000/api_sandwhiches/create/', postObj)
                .then(res => {
                    if (res.status === 201) {
                        this.props.history.push(`/`);
                    }
                })
                .catch(error => console.error(error));
        } else if (requestType === "put") {
            await axios.put(`http://127.0.0.1:8000/api_sandwhiches/${sandwhichID}/update/`, postObj)
                .then(res => {
                    if (res.status === 200) {
                        this.props.history.push(`/`);
                    }
                })
                .catch(error => console.error(error));
            }
        };

        render() {
            return (
                <div>
                    <Form 
                        onSubmit={event => 
                            this.handleFormSubmit(
                                event,
                                this.props.requestType,
                                this.props.sandwhichID
                            )
                        }
                    >
                        <FormItem label="Title">
                            <Input name = "title" placeholder="Put a title here" />
                        </FormItem>
                        <FormItem label="Content">
                            <Input name="content" placeholder="Enter some content ..." />
                        </FormItem>
                        <FormItem >
                            <Button type="primary" htmlType="submit">
                                {this.props.btnText}
                            </Button>
                        </FormItem>
                    </Form>
                </div>
            );
        }
    }

    const mapStateToProps = state => {
        return {
            token: state.token
        };
    };

    export default connect(mapStateToProps)(SandwhichForm)

怎么了:

  1. 信息正在发布并转到 api
  2. 现在在控制台而不是浏览器中出现错误
  3. 信息不再发布

标签: javascriptreactjsdjango-rest-framework

解决方案


推荐阅读