mysql - 通过axios post发送数据在mysql中给出空数据。谁能告诉我是什么问题

Question

export class AddCategory extends Component {
    state = {
        categoryForm: {
            category: {
                elementType: 'input',
                elementConfig: {
                    type: 'text',
                    placeholder: 'Enter Category'
                },
                value: '',
                validation: {
                    required: true
                },
                valid: false,
                touched: false
            }
        }
    };

    checkValidity(value, rules) {
        let isValid = true;

        if (!rules) {
            return true;
        }

        if (rules.required) {
            isValid = value.trim() !== '' && isValid;
        }

        return isValid;
    }
    inputChangedHandeller = (event, controlNameOne) => {
        const copyLoginFrom = {
            ...this.state.categoryForm,
        };
        const newCopy = {
            ...copyLoginFrom[controlNameOne]
        };
        newCopy.value = event.target.value;
        newCopy.valid = this.checkValidity(newCopy.value, newCopy.validation);
        newCopy.touched = true;
        copyLoginFrom[controlNameOne] = newCopy;
        let formIsValid = true;
        for (let inputIdentifier in copyLoginFrom) {
            formIsValid = copyLoginFrom[inputIdentifier].valid && formIsValid;
        }
        this.setState({
            categoryForm: copyLoginFrom,
            formIsValid: formIsValid
        });
    }

    dataPost = (event) => {
        event.preventDefault();
        const formData = {};
        for (let addressData in this.state.categoryForm) {
            formData[addressData] = this.state.categoryForm[addressData].value;
        }
        const newAddress = {
            newAddressData: formData
        }
        console.log("Hello......." + newAddress);
        const parentId = this.state.parent_id;
        const options = {
            method: 'POST',
            headers: {
                Authorization: "Bearer " + localStorage.getItem("token")
            },
            data: formData,
            url: 'http://localhost:8080/admin/category/'
        }
        axios(options);
    }
    render() {
        const formElementsArray = []; //converting state object to the array I can loop throuh
        for (let key in this.state.categoryForm) {
            formElementsArray.push({
                id: key,
                config: this.state.categoryForm[key]
            });
        }

        let form = ( <
            form onSubmit = {
                this.dataPost
            } > {
                formElementsArray.map(forElement => ( <
                    Input key = {
                        forElement.id
                    }
                    elementType = {
                        forElement.config.elementType
                    }
                    elementConfig = {
                        forElement.config.elementConfig
                    }
                    value = {
                        forElement.config.value
                    }
                    invalid = {
                        !forElement.config.valid
                    }
                    shouldValidate = {
                        forElement.config.validation
                    }
                    touched = {
                        forElement.config.touched
                    }
                    elementGet = {
                        (event) => this.inputChangedHandeller(event, forElement.id)
                    }
                    />
                ))
            }

            <
            button className = "btn btn-primary"
            disabled = {
                !this.state.formIsValid
            } > Submit < /button> <
            /form>
        )
        return ( <
            div >
            <
            div className = {
                styles.Login
            } > {
                form
            } <
            /div> <
            /div>
        )
    }
}

我正在尝试使用 axios 发送数据，但我在 mysql 表中得到的输出是 Null。谁能告诉我我的代码有什么问题。我尝试在控制台上打印发送的数据，我得到的输出是 [object Object]我尝试使用 stringify 方法，但它在发布数据时给出了标题错误

标签： mysqlreactjsspring-bootaxios

Answer 1

试试 qs 这是一个查询字符串解析器：

npm install qs

接着 ：

 import qs from "qs"

// in your body 

     const options = {
            method: 'POST',
            headers: {
                Authorization: "Bearer " + localStorage.getItem("token"),
               'Content-Type': 'application/x-www-form-urlencoded' // need to add content type
            },
            data: qs.stringify(formData),
            url: 'http://localhost:8080/admin/category/'
        }